<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>手术综合态势</title>
    <script src="js/jquery.js" type="text/javascript"></script>
    <link href="./css/comon0.css" rel="stylesheet" type="text/css">
    <link href="./css/index.css" rel="stylesheet" type="text/css">
    <link href="./css/common.css" rel="stylesheet" type="text/css">
    <link href="./css/swiper.min.css" rel="stylesheet" type="text/css">

</head>
<script>
    $(window).load(function () {
        $(".loading").fadeOut()
    })

    /****/
    $(document).ready(function () {
        var whei = $(window).width()
        $("html").css({
            fontSize: whei / 20
        })
        $(window).resize(function () {
            var whei = $(window).width()
            $("html").css({
                fontSize: whei / 20
            })
        });
    });


</script>

<script src="js/axios.js"></script>
<script src="js/vue.js"></script>
<script src="js/element.js"></script>
<script src="js/echarts.js"></script>
<script src="js/echarts-liquidfill.js"></script>
<script src="js/qs.js"></script>
<script src="js/swiper.js"></script>
<script src="js/swipe.js"></script>

<!-- 2. 引入样式 -->
<link href="js/elementIndex.css" rel="stylesheet">

<body>
    <div class="loading">
        <div class="loadbox"><img src="images/loading.gif"> 页面加载中...</div>
    </div>

    <div class="mainbox" id="app">
        <div class="shadow" v-show="mapShow">
            <div style="width: 86%;height: 8rem;margin-left:6%;margin-top: 1.5rem;border-radius: 0.10rem">
                <div class="mapIframe2">
                    <div
                        style="width: 4%;height: 70%;background: linear-gradient(to right, #1E1F25, rgba(0, 0, 0, 0));z-index: 20;position: absolute;">
                    </div>
                    <div
                        style="width: 4%;height: 70%;background: linear-gradient(to left, #1E1F25, rgba(0, 0, 0, 0));z-index: 20;position: absolute;right: 2%;">
                    </div>
                    <!-- <iframe src="http://172.19.44.2:8080/location_op/index_screen.html?initZoom=39&mapMarginLeft=-295&mapMarginTop=-140" allowTransparency='true' frameborder='no'
						 allow="geolocation; microphone; camera; midi; encrypted-media;" width="100%" height="100%" style="border-radius: 0.10rem"></iframe> -->

                    <!--						<iframe src="http://172.16.14.196:8080/location_op_screen/index_screen.html?initZoom=45&mapMarginLeft=135&mapMarginTop=20" allowTransparency='true' frameborder='no'-->
                    <!--						allow="geolocation; microphone; camera; midi; encrypted-media;" width="100%" height="100%" style="border-radius: 0.10rem"></iframe>-->

                </div>
            </div>
            <div @click="offMap" style="width: 0.6rem;height: 0.6rem;position: relative;left: 48%;top:-0.3rem">
                <img class="qx-icon" src="images/quxiao.png">
            </div>
        </div>


        <ul class="clearfix">
            <!-- 左 -->
            <li class="li1">
                <!-- 左上 -->
                <div class="box1" style="height: 4.06rem">
                    <div class="box-head">
                        <span class="box-head-title">
                            今日患者等待平均时长
                        </span>
                        <div class="show-contents1">
                            <img style="width: .24rem; height: .24rem; position: absolute; right: 1.8rem;top: .2rem"
                                referrerpolicy="no-referrer" src="images/info.png">
                            <div class="info01 show-text">
                                <div>患者等待时长:</div>
                                <div>∑（同一房间的患者入室时间 - 患者到达缓冲区时间） / 符合条件数量 （急诊除外）</div>
                            </div>
                        </div>

                        <span class="box-head-title-y2">
                            平均{{averageWaitingPatientsTime}}´
                        </span>
                        <!--下拉框 废弃-->
                        <!--                                    <el-select @change="handleSelectChange2" class="my-select2" placeholder="请选择"-->
                        <!--                                               v-model="departmentOptions">-->
                        <!--                                        <el-option-->
                        <!--                                                :key="item.departmentNumber"-->
                        <!--                                                :label="item.departmentName"-->
                        <!--                                                :value="item.departmentNumber"-->
                        <!--                                                v-for="item in departmentOptionsList"-->
                        <!--                                        ></el-option>-->
                        <!--                                    </el-select>-->
                    </div>
                    <div style="width: 100%;height: 16%;">
                        <!--                        </div>-->
                        <!-- <div v-else style="width: 100%;text-align: center;">
                                <span style="line-height:0.8rem;font-size: 0.2rem;;color: #FFFFFF;font-family: Source Han Sans CN;">暂无数据</span>
                            </div> -->
                        <!--                    <div  v-show="showChart1" ref="connectionAverageTimeChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <div v-show="showChart2" ref="averageWaitingTimeForPatientsChart"
                            style="height: 4rem;width:4.7rem;"></div>
                        <!--                    <div  v-show="showChart3" ref="averageTimeOfAnesthesiaTransitionChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <!--                    <div  v-show="showChart4" ref="averageTimeOfSurgicalConnectionChart" style="height: 2.8rem;width:4.7rem;"></div>-->


                    </div>

                    <!--                <div class="carousel-indicators">-->
                    <!--                                      <span-->
                    <!--                                              v-for="data in items"-->
                    <!--                                              :key="data.content"-->
                    <!--                                              class="carousel-indicator"-->
                    <!--                                              :class="{ active: data.content  === currentIndex }"-->
                    <!--                                              @click="changeSlide(data.content)"-->
                    <!--                                      ></span>-->
                    <!--                </div>-->

                </div>





                <!-- 左中 -->

                <div class="box3" style="height: 3.0rem;margin-top:0.15rem ;">
                    <div class="box-head">
                        <span class="box-head-title">
                            今日连台衔接平均时长
                        </span>
                        <div class="show-contents2">
                            <img style="width: .24rem; height: .24rem; position: absolute; right: 1.8rem;top: .2rem"
                                referrerpolicy="no-referrer" src="images/info.png">
                            <div class="info02 show-text">
                                <div>连台衔接时长:</div>
                                <div>∑（同一房间的下台患者入室时间 - 上台患者出室时间） / 符合条件数量 （急诊除外）</div>
                            </div>
                        </div>
                        <span class="box-head-title-y2">
                            平均{{connectionAverageTime}}´
                        </span>
                    </div>
                    <div style="width: 100%;height: 16%;">
                        <!--                        </div>-->
                        <!-- <div v-else style="width: 100%;text-align: center;">
                                                <span style="line-height:0.8rem;font-size: 0.2rem;;color: #FFFFFF;font-family: Source Han Sans CN;">暂无数据</span>
                                            </div> -->
                        <div v-show="showChart1" ref="connectionAverageTimeChart" style="height: 2.8rem;width:4.7rem;">
                        </div>
                        <!--                                    <div  v-show="showChart2" ref="averageWaitingTimeForPatientsChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <!--                                    <div  v-show="showChart3" ref="averageTimeOfAnesthesiaTransitionChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <!--                                    <div  v-show="showChart4" ref="averageTimeOfSurgicalConnectionChart" style="height: 2.8rem;width:4.7rem;"></div>-->


                    </div>

                    <!--                                <div class="carousel-indicators">-->
                    <!--                                      <span-->
                    <!--                                              v-for="data in items"-->
                    <!--                                              :key="data.content"-->
                    <!--                                              class="carousel-indicator"-->
                    <!--                                              :class="{ active: data.content  === currentIndex }"-->
                    <!--                                              @click="changeSlide(data.content)"-->
                    <!--                                      ></span>-->
                    <!--                                </div>-->


                </div>

                <!-- 左下 -->
                <div class="box6" style="height: 3rem">
                    <div class="box-head">
                        <span class="box-head-title">
                            今日手术等级
                        </span>
                    </div>

                    <div style="width: 100%;height: 80%;">

                        <div style="width: 100%;height: 100%;float: left;">

                            <div style="width: 100%;height: 20%;;top: 50%;position: absolute;text-align: center;">
                                <div
                                    style="width: 100%;height: 40%;font-size: 0.17rem;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;color: #E5E6ED;">
                                    {{levelName}}
                                </div>
                                <div
                                    style="width: 100%;height: 60%;font-size: 0.3rem;font-family: Inter-Regular_Medium, Inter;font-weight: normal;color: #FFFFFF;">
                                    {{levelValue}}
                                </div>

                            </div>
                            <div id="levelDraw" style="height: 2.3rem;"></div>
                        </div>
                        <div style="width: 50%;height: 100%;float: left;" v-show:1="0">



                            <div
                                style="position: relative;top: 0.35rem;left:0.3rem; width: 1.7rem;height: 0.6rem;background: #242833;border-radius: 0.10rem;">
                                <img src="images/level1.png" class="level-img"
                                    style="position: absolute;top:0.12rem;left:0.15rem;">
                                <span
                                    style="color:#26D4FF ;font-weight: 400;font-size: 0.15rem;position: absolute;top:0.23rem;left:0.2rem ;">
                                    {{outputThree}}
                                </span>
                                <span
                                    style="color:#757B8C ;font-weight: 400;font-size: 0.13rem;position: absolute;top:0.1rem;left:0.7rem;">
                                    三级手术(台)
                                </span>

                                <span
                                    style="color:#FFFFFF ;font-weight: 400;font-size: 0.2rem;position: absolute;top:0.3rem;left:0.7rem ;">
                                    {{outputThreeCount}}
                                </span>
                            </div>


                            <div
                                style="position: relative;top: 0.55rem;left:0.3rem; width: 1.7rem;height: 0.6rem;background: #242833;border-radius: .10rem;">
                                <img src="images/level2.png" class="level-img"
                                    style="position: absolute;top:0.12rem;left:0.15rem;">
                                <span
                                    style="color:#30E0A1 ;font-weight: 400;font-size: 0.15rem;position: absolute;top:0.23rem;left:0.2rem ;">
                                    {{outputFour}}
                                </span>
                                <span
                                    style="color:#757B8C ;font-weight: 400;font-size: 0.13rem;position: absolute;top:0.1rem;left:0.7rem;">
                                    四级手术(台)
                                </span>

                                <span
                                    style="color:#FFFFFF ;font-weight: 400;font-size: 0.2rem;position: absolute;top:0.3rem;left:0.7rem ;">
                                    {{outputFourCount}}
                                </span>
                            </div>

                        </div>

                    </div>

                </div>


            </li>
            <!-- 中 -->
            <li class="li2">

                <!-- 中上标志及时间 -->
                <div style="height: 0.45rem;width:100%;position: relative">
                    <div v-if="hospitalSwitch == '005'">
                        <div class="image_10">
                            <img class="image_9syLogo" referrerpolicy="no-referrer" src="images/logo2.png" />
                            <span class="text-y0Logo">|</span>
                            <!-- <img class="image_hosLogo" referrerpolicy="no-referrer" src="images/logoJST.png" /> -->
                            <span class="text_y1Logo">手术综合态势</span>
                        </div>

                        <div style="width: 40% ;float: right; height: auto; ">
                            <span class="text_y2">{{nowDate}}</span>
                            <span class="text_y3">{{nowTime}}</span>
                        </div>
                    </div>

                    <div v-if="hospitalSwitch !== '005'">
                        <div class="image_10">
                            <img class="image_9" referrerpolicy="no-referrer" src="images/logo2.png" />
                            <span class="text-y0">|</span>
                            <span class="text_y1">手术综合态势</span>
                        </div>

                        <div style="width: 40% ;float: right; height: auto; ">
                            <span class="text_y2">{{nowDate}}</span>
                            <span class="text_y3">{{nowTime}}</span>
                        </div>
                    </div>

                </div>
                <!--            中上 -各级手术台数-->
                <div style="height: 0.5rem;width:100%;margin-bottom: 0.1rem">
                    <div
                        style="width: 25%;height: 100%;border-radius: 0.10rem;text-align: center;float: left;position: relative;padding: 0 0.1rem 0 0">
                        <div class="opLevelBox" style="">
                            <div
                                style="width: 0.35rem;height: 0.35rem;position: absolute;left:0.15rem;top:0.07rem;text-align: center;">
                                <img class="image-icon-y2" src="images/water5.png" />
                                <span style="" class="note-span3">{{outputOne}}</span>
                            </div>

                            <span class="note-span4" style="position:relative;float: left;">一级手术</span>
                            <div class="" style="position:relative;float: right;margin-right: 10%;">
                                <span class="note-span1">{{outputOneCount}}</span>
                                <span class="note-span2">台</span>
                            </div>
                        </div>
                    </div>
                    <div
                        style="width: 25%;height: 100%;border-radius: 0.10rem;text-align: center;float: left;position: relative;padding: 0 0.1rem 0 0.1rem">
                        <div class="opLevelBox" style="">
                            <div
                                style="width: 0.35rem;height: 0.35rem;position: absolute;left:0.15rem;top:0.07rem;text-align: center;">
                                <img class="image-icon-y2" referrerpolicy="no-referrer" src="images/water3.png">
                                <span class="note-span3">{{outputTwo}}</span>
                            </div>
                            <span class="note-span4" style="position:relative;float: left;">二级手术</span>
                            <div class="" style="position:relative;float: right;margin-right: 10%;">
                                <span class="note-span1">{{outputTwoCount}}</span>
                                <span class="note-span2">台</span>
                            </div>
                        </div>
                    </div>
                    <div
                        style="width: 25%;height: 100%;border-radius: 0.10rem;text-align: center;float: left;position: relative;padding: 0 0.1rem 0 0.1rem">
                        <div class="opLevelBox" style="">
                            <div
                                style="width: 0.35rem;height: 0.35rem;position: absolute;left:0.15rem;top:0.07rem;text-align: center;">
                                <img class="image-icon-y2" referrerpolicy="no-referrer" src="images/water1.png">
                                <span class="note-span3">{{outputThree}}</span>
                            </div>

                            <span class="note-span4" style="position:relative;float: left;">三级手术</span>
                            <div class="" style="position:relative;float: right;margin-right: 10%;">
                                <span class="note-span1">{{outputThreeCount}}</span>
                                <span class="note-span2">台</span>
                            </div>
                        </div>
                    </div>
                    <div
                        style="width: 25%;height: 100%;border-radius: 0.10rem;text-align: center;float: left;position: relative;padding: 0 0 0 0.1rem">
                        <div class="opLevelBox" style="">
                            <div
                                style="width: 0.35rem;height: 0.35rem;position: absolute;left:0.15rem;top:0.07rem;text-align: center;">
                                <img class="image-icon-y2" referrerpolicy="no-referrer" src="images/water2.png">
                                <span class="note-span3">{{outputFour}}</span>
                            </div>

                            <span class="note-span4" style="position:relative;float: left;">四级手术</span>
                            <div class="" style="position:relative;float: right;margin-right: 10%;">
                                <span class="note-span1">{{outputFourCount}}</span>
                                <span class="note-span2">台</span>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 中上 -->
                <div class="box1" style="height: 3.0rem">


                    <div class="block_117 ">
                        <div class="block_118">
                            <div class="group_204">
                                <span class="text_132">今日手术量&nbsp</span>
                                <span class="text_260">含已取消{{cancle}}台</span>
                                <!--                            <span class="text_260-oper">{{cancle}}</span>-->
                            </div>
                            <div>
                                <div class="text_133">
                                    {{planCount}}
                                    <span class="section_125 ">台</span>
                                </div>
                            </div>
                        </div>
                        <div class="group_8">
                            <div class="group_204">
                                <img class="label_7" referrerpolicy="no-referrer" src="images/oper-icon1.png" />
                                <span class="text-oper-type" style="position:relative; top:-0.05rem;">择期手术（台）</span>
                            </div>
                            <div class="zeClass">
                                <div class="zeClass-1">
                                    {{chooseCount}}
                                </div>
                                <!--									<div class="zeClass-2"></div>-->
                                <!--									<div class="zeClass-3">含临时{{temporaryCount}}</div>-->
                            </div>
                            <div class="group_29 flex-row">

                                <div class="box_38 flex-col" style="text-align: center;">
                                    <div style="width: 100%;height: 50%;">
                                        <span class="text_135">{{chooseFinished}}</span>
                                    </div>
                                    <div style="width: 100%;height: 50%;">
                                        <span class="text_136">已完成</span>
                                    </div>

                                </div>
                                <div
                                    style="height: 0.65rem;width:0.65rem;z-index: 99;position: absolute;top: -0.38rem;left:-0.18rem">
                                    <img height="100%" src="./images/oper-icon21.png" width="100%">
                                </div>
                                <div id="operDraw1"
                                    style="height: 0.9rem;width: 0.9rem;z-index: 99;position: absolute;top:-0.495rem;left:-0.30rem; overflow: hidden; ">
                                </div>
                            </div>
                        </div>

                        <div class="group_8">
                            <div class="group_204">
                                <img class="label_7" referrerpolicy="no-referrer" src="images/oper-icon2.png" />
                                <span class="text-oper-type" style="position:relative; top:-0.05rem;">急诊手术（台）</span>
                            </div>
                            <div>
                                <div class="text_134">
                                    {{emergencyCount}}
                                </div>

                            </div>
                            <div class="group_29 flex-row">
                                <div class="box_388 flex-col" style="text-align: center;">
                                    <div style="width: 100%;height: 50%;">
                                        <span class="text_135">{{emergencyFinished}}</span>
                                    </div>
                                    <div style="width: 100%;height: 50%;">
                                        <span class="text_136">已完成</span>
                                    </div>
                                </div>
                                <div
                                    style="height: 0.65rem;width:0.65rem;z-index: 99;position: absolute;top: 0.1rem;left:-0.18rem">
                                    <img height="100%" src="./images/oper-icon21.png" width="100%">
                                </div>
                                <div id="operDraw2"
                                    style="height: 0.9rem;width: 0.9rem;z-index: 99;position: absolute;top:-0.01rem;left:-0.31rem">
                                </div>
                            </div>
                        </div>

                    </div>
                    <div class="runTiao">
                        <div style="width: 100%;height: 18%;font-size: 0.14rem;color: #757B8C;">
                            <div style="height: 100%;text-align: center;float: left;background: linear-gradient(270deg, #5c5d6b 0%, #565560  100%);text-align: center;border-radius: .15rem 0 0 .15rem"
                                v-bind:style="{width:width1+'%'}" v-show="width1!=0">

                                <div class="runTiao-img" v-show="width1>0">
                                    <img height="100%" src="images/wks.png" width="100%">
                                    <span style="position: relative;top:-0.35rem;color: #fff;">
                                        {{beforeOper}}
                                    </span>
                                </div>
                                <span class="runTiao-span" v-show="width1>0">待开始</span>
                            </div>
                            <div style="height: 100%;text-align: center;float: left;background: linear-gradient(270deg, #007CD3 0%, #3BC7CF 100%, #3BC8CF 100%, #3AC9CE 100%);border-radius: 0;"
                                v-bind:style="{width:width2+'%'}" v-show="width2!=0">

                                <div class="runTiao-img" v-show="width2>0">
                                    <img height="100%" src="images/tiao2.png" width="100%">
                                    <span style="position: relative;top:-0.35rem;color: #fff;">
                                        {{opering}}
                                    </span>
                                </div>
                                <span class="runTiao-span" v-show="width2>0">手术中</span>
                            </div>
                            <div style="height: 100%;text-align: center;float: left;background: linear-gradient(270deg, #21ABB8 0%, #77E081 100%, #2391b6 100%, #083949 100%);border-radius: 0"
                                v-bind:style="{width:width3+'%'}" v-show="width3!=0">

                                <div class="runTiao-img" v-show="width3>0">
                                    <img height="100%" src="images/tiao3.png" width="100%">
                                    <span style="position: relative;top:-0.35rem;color: #fff;">
                                        {{afterOper}}
                                    </span>
                                </div>
                                <span class="runTiao-span" v-show="width3>0">已完成</span>
                            </div>
                            <div style="height: 100%;text-align: center;float: left;background: linear-gradient(270deg, #01242d 0%, #083949  100%);text-align: center;border-radius: 0 .15rem .15rem 0;"
                                v-bind:style="{width:width4+'%'}" v-show="width4!=0">
                                <div class="runTiao-img" v-show="width4>0">
                                    <img height="100%" src="images/tiao4.png" width="100%">
                                    <span style="position: relative;top:-0.35rem;color: #fff;">
                                        {{cancle}}
                                    </span>
                                </div>
                                <span class="runTiao-span" v-show="width4>0">已取消</span>

                            </div>
                        </div>
                    </div>

                </div>

                <!-- 中中 -->
                <div class="box4" style="height:3.0rem;">
                    <div class="box-head">
                        <span class="box-head-title-y1" style="margin-top: 0.15rem">
                            昨日手术间使用率
                        </span>


                    </div>
                    <div style="width:20%;float: left">
                        <div style="width: 100%;height: 80%;">
                            <div id="opRoomUsageRateWaterPolo" style="height: 2.1rem;"></div>
                        </div>


                    </div>
                    <div style="width:79%;float: left;">
                        <icon class="icon-arrow-right" @click="changeRooms2"><img src="images/leftArrow.png"
                                class="icon-arrow"></icon>
                        <icon class="icon-arrow-left" @click="changeRooms3"><img src="images/leftArrow.png"
                                class="icon-arrow"></icon>
                        <div id="test" style="width: 100%;height: 100%;">


                            <div v-show="!operatingRoomIsNull" v-if="operatingRoomOptionsList.length === 0"
                                class="noData">
                                <img src="images/loading.gif" class="noData-img">
                                <span class="nodata-span">加载中...</span>
                            </div>
                            <div v-show="!operatingRoomIsNull" v-if="operatingRoomOptionsList.length !== 0"
                                id="opRoomUsageRate1" ref="opRoomUsageRate1" style="height: 2.35rem"></div>

                            <div v-show="operatingRoomIsNull" class="noData">
                                <img src="images/noData.png" class="noData-img">
                                <span class="nodata-span">暂无数据</span>
                            </div>

                            <!--                        <div v-else style="font-size: 0.24rem;text-align: center;line-height: 2rem" >暂无数据</div>-->


                            <div class="carousel-indicators2">
                                <span v-for="data in operatingRoomOptionsList" :key="data.value"
                                    class="carousel-indicator" :class="{ active: data.value[0]  === RoomRateIndex }"
                                    @click="changeRooms(data.value[0])"></span>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 中下 -->

                <div class="box4" style="height:3.0rem;width: 14.6rem;">
                    <div class="box-head" style="">
                        <span class="box-head-title-y1">
                            昨日、今日各手术科室手术量
                        </span>
                        <div id="multiColumnHistogram" style="height: 2.9rem;padding-top:1%"></div>

                        <!--                        <div v-if="hospitalNo !== 'BJJST'" id="multiColumnHistogram" style="height: 2.9rem;padding-top:1%"></div>-->
                        <div class="carousel-indicators3">
                            <span v-for="data in tyOperaCountSwitchList" :key="data.value" class="carousel-indicator"
                                :class="{ active: data.value[0]  === tyOperaCountIndex }"
                                @click="tyOperaCountChangePart(data.value[0])"></span>
                        </div>
                    </div>
                    <!-- <div v-else style="width: 100%;text-align: center;">
                                <span style="line-height:0.8rem;font-size: 0.2rem;;color: #FFFFFF;font-family: Source Han Sans CN;">暂无数据</span>
                            </div> -->
                </div>


                <!--            中底部翻页-->
                <div style="width: 100%;height: 4%;text-align: center">
                    <button class="el-button-b" v-for="data in buttons" :key="data.content"
                        style="margin-right: 0.10rem;" :class="{ buttonActive2: data.content === buttonIndex }"
                        @click="changeButton3(data.content)"></button>
                </div>

            </li>


            <!-- 右 -->
            <li class="li3">
                <!-- 右上 -->
                <div class="box1" style="height: 4.06rem">
                    <div class="box-head">
                        <span class="box-head-title">
                            今日手术衔接平均时长
                        </span>
                        <div class="show-contents3">
                            <img style="width: .24rem; height: .24rem; position: absolute; right: 1.8rem;top: .2rem"
                                referrerpolicy="no-referrer" src="images/info.png">
                            <div class="info03 show-text">
                                <div>手术衔接时长:</div>
                                <div>∑（同一房间的下台手术开始时间 - 上一台手术结束时间）/ 符合条件数量 （急诊除外）</div>
                            </div>
                        </div>
                        <span class="box-head-title-y2">
                            平均{{SurgicalConnectionAverageTime}}´
                        </span>
                        <!--下拉框 废弃-->
                        <!--                                    <el-select @change="handleSelectChange2" class="my-select2" placeholder="请选择"-->
                        <!--                                               v-model="departmentOptions">-->
                        <!--                                        <el-option-->
                        <!--                                                :key="item.departmentNumber"-->
                        <!--                                                :label="item.departmentName"-->
                        <!--                                                :value="item.departmentNumber"-->
                        <!--                                                v-for="item in departmentOptionsList"-->
                        <!--                                        ></el-option>-->
                        <!--                                    </el-select>-->
                    </div>
                    <div style="width: 100%;height: 16%;">
                        <!--                        </div>-->
                        <!-- <div v-else style="width: 100%;text-align: center;">
                                <span style="line-height:0.8rem;font-size: 0.2rem;;color: #FFFFFF;font-family: Source Han Sans CN;">暂无数据</span>
                            </div> -->
                        <!--                    <div  v-show="showChart1" ref="connectionAverageTimeChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <!--                    <div  v-show="showChart2" ref="averageWaitingTimeForPatientsChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <!--                    <div  v-show="showChart3" ref="averageTimeOfAnesthesiaTransitionChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <div v-show="showChart4" ref="averageTimeOfSurgicalConnectionChart"
                            style="height: 4rem;width:4.7rem;"></div>


                    </div>

                    <!--                <div class="carousel-indicators">-->
                    <!--                                      <span-->
                    <!--                                              v-for="data in items"-->
                    <!--                                              :key="data.content"-->
                    <!--                                              class="carousel-indicator"-->
                    <!--                                              :class="{ active: data.content  === currentIndex }"-->
                    <!--                                              @click="changeSlide(data.content)"-->
                    <!--                                      ></span>-->
                    <!--                </div>-->

                </div>

                <!-- 右中 -->
                <div class="box3" style="height: 3.0rem;margin-top:0.15rem ;">
                    <div class="box-head">
                        <span class="box-head-title">
                            今日麻醉衔接平均时长
                        </span>
                        <div class="show-contents4">
                            <img style="width: .24rem; height: .24rem; position: absolute; right: 1.8rem;top: .2rem"
                                referrerpolicy="no-referrer" src="images/info.png">
                            <div class="info04 show-text">
                                <div>麻醉衔接时长:</div>
                                <div>∑（同一房间的下台麻醉开始时间 - 上一台离开手术室时间）/ 符合条件数量 （急诊除外）</div>
                            </div>
                        </div>
                        <span class="box-head-title-y2">
                            平均{{averageAnesthesiaTransitionTime}}´
                        </span>
                        <!--下拉框 废弃-->
                        <!--                                    <el-select @change="handleSelectChange2" class="my-select2" placeholder="请选择"-->
                        <!--                                               v-model="departmentOptions">-->
                        <!--                                        <el-option-->
                        <!--                                                :key="item.departmentNumber"-->
                        <!--                                                :label="item.departmentName"-->
                        <!--                                                :value="item.departmentNumber"-->
                        <!--                                                v-for="item in departmentOptionsList"-->
                        <!--                                        ></el-option>-->
                        <!--                                    </el-select>-->
                    </div>
                    <div style="width: 100%;height: 16%;">
                        <!--                        </div>-->
                        <!-- <div v-else style="width: 100%;text-align: center;">
                                <span style="line-height:0.8rem;font-size: 0.2rem;;color: #FFFFFF;font-family: Source Han Sans CN;">暂无数据</span>
                            </div> -->
                        <!--                    <div  v-show="showChart1" ref="connectionAverageTimeChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <!--                    <div  v-show="showChart2" ref="averageWaitingTimeForPatientsChart" style="height: 2.8rem;width:4.7rem;"></div>-->
                        <div v-show="showChart3" ref="averageTimeOfAnesthesiaTransitionChart"
                            style="height: 2.8rem;width:4.7rem;"></div>
                        <!--                    <div  v-show="showChart4" ref="averageTimeOfSurgicalConnectionChart" style="height: 2.8rem;width:4.7rem;"></div>-->


                    </div>

                    <!--                <div class="carousel-indicators">-->
                    <!--                                      <span-->
                    <!--                                              v-for="data in items"-->
                    <!--                                              :key="data.content"-->
                    <!--                                              class="carousel-indicator"-->
                    <!--                                              :class="{ active: data.content  === currentIndex }"-->
                    <!--                                              @click="changeSlide(data.content)"-->
                    <!--                                      ></span>-->
                    <!--                </div>-->


                </div>

                <!-- 右下-->


            </li>
        </ul>
    </div>


    <script type="text/javascript">// 初始化Swiper


        function scrollToLocation() {
            var mainContainer = $('#thisMainPanel'),
                scrollToContainer = mainContainer.find('.son-panel:last'); //滚动到<div id="thisMainPanel">中类名为son-panel的最后一个div处
            //scrollToContainer = mainContainer.find('.son-panel:eq(5)');//滚动到<div id="thisMainPanel">中类名为son-panel的第六个处
            //非动画效果
            //mainContainer.scrollTop(
            //  scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop()
            //);
            //动画效果
            mainContainer.animate({
                scrollTop: mainContainer.find('.son-panel:last').offset().top - mainContainer.offset().top + mainContainer.scrollTop()

            }, 3000, function () {

                mainContainer.find(".son-panel:first").appendTo(mainContainer);
                scrollToLocation();
            });	 //2秒滑动到指定位置
        }


        function scrollToLocationFrist() {
            var mainContainerF = $('#fristGun'),
                scrollToContainerF = mainContainerF.find('.son-fristGun:last'); //滚动到<div id="thisMainPanel">中类名为son-panel的最后一个div处
            //scrollToContainer = mainContainer.find('.son-panel:eq(5)');//滚动到<div id="thisMainPanel">中类名为son-panel的第六个处
            //非动画效果
            //mainContainer.scrollTop(
            //  scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop()
            //);
            //动画效果
            mainContainerF.animate({
                scrollTop: mainContainerF.find('.son-fristGun:last').offset().top - mainContainerF.offset().top + mainContainerF.scrollTop()
            }, 2000, function () {
                mainContainerF.find(".son-fristGun:first").appendTo(mainContainerF);
                scrollToLocationFrist();
            });
        }

        function scrollToLocationFrist2() {
            var mainContainerF2 = $('#fristGun2'),
                scrollToContainerF2 = mainContainerF2.find('.son-fristGun2:last'); //滚动到<div id="thisMainPanel">中类名为son-panel的最后一个div处
            //scrollToContainer = mainContainer.find('.son-panel:eq(5)');//滚动到<div id="thisMainPanel">中类名为son-panel的第六个处
            //非动画效果
            //mainContainer.scrollTop(
            //  scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop()
            //);
            //动画效果
            mainContainerF2.animate({
                scrollTop: mainContainerF2.find('.son-fristGun2:last').offset().top - mainContainerF2.offset().top + mainContainerF2.scrollTop()
            }, 2000, function () {
                mainContainerF2.find(".son-fristGun2:first").appendTo(mainContainerF2);
                scrollToLocationFrist2();
            });
        }

        //
        // function scrollToLocationNote() {
        //     var mainContainerN = $('#noteGun'),
        //         scrollToContainerN = mainContainerN.find('.son-note:last'); //滚动到<div id="thisMainPanel">中类名为son-panel的最后一个div处
        //     //scrollToContainer = mainContainer.find('.son-panel:eq(5)');//滚动到<div id="thisMainPanel">中类名为son-panel的第六个处
        //     //非动画效果
        //     //mainContainer.scrollTop(
        //     //  scrollToContainer.offset().top - mainContainer.offset().top + mainContainer.scrollTop()
        //     //);
        //     //动画效果
        //     mainContainerN.animate({
        //         scrollTop: mainContainerN.find('.son-note:last').offset().top - mainContainerN.offset().top + mainContainerN.scrollTop()
        //     }, 3000, function () {
        //         mainContainerN.find(".son-note:first").appendTo(mainContainerN);
        //         scrollToLocationNote();
        //     });
        // }


        new Vue({

            el: '#app',
            data: function () {
                return {

<<<<<<< HEAD
                    hospitalSwitch: '005',//医院接口选择 000-测试  001-华山西院  002-深圳儿童 003-公网 004-华西 005-北京积水潭
=======
                    hospitalSwitch: '003',//医院接口选择 000-测试  001-华山西院  002-深圳儿童 003-公网 004-华西 005-北京积水潭
>>>>>>> de3b0fe6ba8c0162c520d676deee41e3b698cada
                    // RoomSrc:0,
                    // MapSrc:'',
                    httpUrl: '',
                    httpUrl2: '',

                    isHide: this.getQueryString("isHide") != null ? this.getQueryString('isHide') : "0", //是否隐藏医生名字
                    nowDate: '',
                    nowTime: '',
                    surgicalNumber: this.getQueryString("surgicalNumber") != null ? this.getQueryString('surgicalNumber') : "001",
                    surgicalNumberData: JSON.stringify({ surgicalNumber: this.getQueryString("surgicalNumber") != null ? this.getQueryString('surgicalNumber') : "001", }),
                    cancle: '--', //取消数
                    planCount: '--', //今日全部计划数
                    emergencyCount: '--', //急诊数
                    ready: '--', //待开始数
                    chooseCount: '--', //择期数
                    chooseFinished: '--', //择期已经完成数
                    emergencyFinished: '--', //紧急已经完成数
                    planCountFinished: '--', //今日全部计划数已完成数
                    temporaryCount: '--', // 临时数
                    temporaryFinished: '--', //临时完成数
                    IsTemporaryCompleteRate: '--',//临时完成率

                    opering: '--', //手术中数
                    beforeOper: '--', //术前数
                    afterOper: '--', //完成数

                    waitRoom: '--', //等待接台
                    totalRoom: '--', //房间总数
                    busyRoom: '--', //占用数
                    freeRoom: '--', //空闲数

                    specialOper: '--', //特殊术式
                    specialInfection: '--', //特殊感染人数统计
                    fourCount: '--', //四岁以下人数统计
                    eightyCount: '--', //80岁以上

                    noteList: [],//重点关注信息
                    openingRateList: [], //首台信息

                    OpenedOnSchedule: '--', //准点开台数
                    OnTimeOperRate: '--', //准点开台率
                    UnitsToday: '--', //今日首台数
                    firstOpeReplacementCount: '--', //首台换台数
                    firstOpeReplacementRate: '--', //首台换台率

                    // openingRateList2: [], //首台信息2
                    // OpenedOnSchedule2: 0, //准点开台数
                    // OnTimeOperRate2: 0, //准点开台率
                    // OnTimeOperRate22: 0, //准点开台率
                    // UnitsToday2: 0, //今日首台数

                    departmentOperY: [],
                    departmentOperX: [],

                    LateCount: 0, // 晚点结束台数
                    PunctualityEndTimeRate: 0, //晚点结束率

                    yesterdayEndList: [],

                    outputFourCount: '--',
                    outputFour: '0%',
                    outputThreeCount: '--',
                    outputThree: '0%',
                    outputTwoCount: '--',
                    outputTwo: '0%',
                    outputOneCount: '--',
                    outputOne: '0%',

                    levelList: [{ name: "一级", value: "0" }, { name: "二级", value: "0" }, { name: "三级", value: "0" }, { name: "四级", value: "0" }],

                    width1: 25,
                    width2: 25,
                    width3: 25,
                    width4: 25,
                    intervals: {},

                    emergencyCompleteRate: 0,
                    chooseCompleteRate: 0,

                    pageDepartmentNow: 1, //科室当前页


                    levelValue: '',
                    levelName: '',
                    maxCountPart: 0,

                    timeLevel: "",
                    timeLevel1: "",
                    timeLevel2: "",
                    mapShow: false,



                    showList1: false,
                    showList12: false,
                    showList3: false,
                    showList4: false,
                    showList5: false,

                    hospitalNo: '!SZC',

                    showShou: true,
                    showShou2: true,
                    globalShou: true,
                    // operatingRoomOptions: 'OR01-OR10', // 用于存储选中的值  v-model	绑定值	boolean / string / number
                    // initSelectData: ['partOne', "xData"],

                    RoomRateIndex: "1",
                    timer2: null,
                    autoSwitchInterval2: 20000, // 自动切换间隔时间，单位为毫秒

                    operatingRoomIsNull: false,
                    operatingRoomOptionsList: [ // 可选项列表
                        // { value: 'option1',xData:"xData1", label: 'OR01-OR10' },
                        // { value: 'option2',xData:"xData2",label: 'OR11-OR20' },
                        // { value: 'option3',xData:"xData3", label: 'OR21-OR30' }

                        // {value: ['partOne', "xData"], part: 'OR01-OR10'},
                        // {value: ['partTwo', "xData",], part: 'OR11-OR20'},
                        // {value: ['partThree', "xData",], part: 'OR21-OR30'},
                        // {value: ['partFour', "xData",], part: 'OR31-OR40'},
                    ],
                    operatingRoomUtilizationRate: {
                        // yData: [40 / 40 * 100, 32 / 40 * 100, 31 / 40 * 100, 28 / 40 * 100, 15 / 40 * 100, 35 / 40 * 100, 21, 33, 44, 99],
                        yData: [],
                        // yData1: [],
                        // yData2: [],
                        // yData3: [],
                        // yData4: [],

                        xData: [],
                        // xData1: [],
                        // xData2: [],
                        // xData3: [],
                        // xData4: [],

                        // yData1: [40 / 40 * 100, 32 / 40 * 100, 31 / 40 * 100, 28 / 40 * 100, 15 / 40 * 100, 35 / 40 * 100, 21, 33, 44,99],
                        // yData2: [1,2,3,4,55,77, 21, 33, 44,11],
                        // yData3: [11,22,33,44,55,66, 31, 33, 44,29],
                        // yData4: [12,23,43,12,43,54, 23, 23, 22,44],
                        //
                        // xData: ['OR01', 'OR02', 'OR03', 'OR04', 'OR05', 'OR06', 'OR07', 'OR08', 'OR09', 'OR10'],
                        // xData1: ['OR01', 'OR02', 'OR03', 'OR04', 'OR05', 'OR06', 'OR07', 'OR08', 'OR09', 'OR10'],
                        // xData2: ['OR11', 'OR12', 'OR13', 'OR14', 'OR15', 'OR16', 'OR17', 'OR18', 'OR19', 'OR20'],
                        // xData3: ['OR21', 'OR22', 'OR23', 'OR24', 'OR25', 'OR26', 'OR27', 'OR28', 'OR29', 'OR30'],
                        // xData4: ['OR31', 'OR32', 'OR33', 'OR34', 'OR35', 'OR36', 'OR37', 'OR38', 'OR39', 'OR40'],
                    },

                    //近期全院总体手术量变化
                    departmentOptions: 'all', //初始值
                    departmentOptionsList: [ // 可选项列表
                        { departmentNumber: 'all', departmentName: '全院' },  //保留
                        // {departmentNumber: '9804', departmentName: '消化科'},
                        // {departmentNumber: '6963', departmentName: '手术室'}
                    ],
                    changesInOperVolumeChartData: {
                        all: [11, 12, 13, 14, 15, 16, 17],
                        9804: [12, 42, 35, 44, 41, 15, 16],
                        6963: [15, 33, 15, 24, 33, 45, 11],
                        department: [0, 0, 0, 0, 0, 0, 0],  //当下拉框改变时，自动获取值，默认全院
                    },
                    changesInOperVolumeChartDate: [1, 2, 3, 4, 5, 6, 7],  //日期

                    opTimeDistributionData: [1, 2, 3, 4, 5, 6],
                    caseUtilizationRateCaseRoomsValue: 0,

                    //昨日今日手术量变化
                    // tydepartmentNameList: ['神经科', '内科', '显微科', '外科', '骨科', '内脏科', '儿科', '耳科',"骨骼外科",'手动阀的的科','xxxx科'],
                    // todayCountList: [40, 32, 31, 28, 15, 3,15, 3,3,15, 3,],
                    // yesterdayCountList: [30, 22, 21, 18, 15, 5, 15, 5,5, 15, 5],
                    //折线图
                    tydepartmentNameList: [],
                    todayCountList: [],
                    yesterdayCountList: [],

                    //柱状图

                    tyOperaCountIndex: "1",
                    tyOperaCountTimer: null,
                    tyOperaCountInterval: 10000, // 自动切换间隔时间，单位为毫秒

                    tyOperaCountSwitchList: [ // 可选项列表

                        // {value: ['partOne', "xData"], part: 'OR01-OR10'},
                        // {value: ['partTwo', "xData",], part: 'OR11-OR20'},
                        // {value: ['partThree', "xData",], part: 'OR21-OR30'},
                        // {value: ['partFour', "xData",], part: 'OR31-OR40'},
                    ],
                    tyOperaCountData: {
                        // yData: [40 / 40 * 100, 32 / 40 * 100, 31 / 40 * 100, 28 / 40 * 100, 15 / 40 * 100, 35 / 40 * 100, 21, 33, 44, 99],
                        yDataToday: [],
                        yDataYesterday: [],
                        yDataSum: [],
                        // yData1: [],
                        // yData2: [],

                        xData: [],
                        // yData1: [40 / 40 * 100, 32 / 40 * 100, 31 / 40 * 100, 28 / 40 * 100, 15 / 40 * 100, 35 / 40 * 100, 21, 33, 44,99],
                        // yData2: [1,2,3,4,55,77, 21, 33, 44,11],
                        //
                        // xData: ['OR01', 'OR02', 'OR03', 'OR04', 'OR05', 'OR06', 'OR07', 'OR08', 'OR09', 'OR10'],
                        // xData1: ['OR01', 'OR02', 'OR03', 'OR04', 'OR05', 'OR06', 'OR07', 'OR08', 'OR09', 'OR10'],
                        // xData2: ['OR11', 'OR12', 'OR13', 'OR14', 'OR15', 'OR16', 'OR17', 'OR18', 'OR19', 'OR20'],
                    },



                    earlyCount: 0,
                    workDayLateStartCount: 0,
                    workDayLateEndCount24: 0,
                    workDayLateEndCount18: 0,
                    holidayCount: 0,

                    changeSlideSwitch: false,//轮播开关
                    showChart1: true,
                    showChart2: true,
                    showChart3: true,
                    showChart4: true,


                    items: [
                        { content: '1' },
                        { content: '2' },
                        { content: '3' },
                        { content: '4' },

                    ],
                    titleChanges: "连台衔接时长",
                    connectionAverageTime: '...', //连台平均
                    averageWaitingPatientsTime: '...',  //等待平均
                    averageAnesthesiaTransitionTime: '...',  // 麻醉平均
                    SurgicalConnectionAverageTime: '...', //手术平均

                    //患者等待平均时长横坐标
                    averageWaitingPatientsListXSite: ['0´', '5´', '10´', '15´', '20´', '25´', '30´+', ''],

                    connectionAverageTimeList: [],
                    averageWaitingPatientsList: [],
                    averageAnesthesiaTransitionTimeList: [],
                    SurgicalConnectionAverageTimeList: [],

                    AverageTime: 0,
                    // ... 其他数据属性
                    timer: null,
                    autoSwitchInterval: 5000, // 自动切换间隔时间，单位为毫秒
                    currentIndex: "2", // 当前显示的幻灯片索引

                    firstOpStartTimeDistributionList: [],

                    yAxisMin: 0,
                    yAxisMax1: 40,  //连台
                    yAxisMax2: 40,  //患者
                    yAxisMax3: 40,  //麻醉
                    yAxisMax4: 40,  //手术

                    yAxisMax5: 40,  //首台开台时间分布


                    isActiveButton1: true,
                    isActiveButton2: false,
                    isActiveButton3: true,
                    isActiveButton4: false,
                    buttonIndex: "2",
                    timer3: null,
                    buttons: [
                        { content: '1' },
                        { content: '2' },
                    ],
                    autoSwitchIntervalButton: 60 * 1000 * 3, // 自动切换间隔时间，单位为毫秒

                    mouse: true,
                }
            },
            mounted() {
                this.init();
                let self = this;

                let lastX = -1;
                let lastY = -1;
                let timer;

                //监听鼠标
                document.addEventListener('mousemove', (event) => {
                    self.mouse = false //停止翻页

                    lastX = event.clientX;
                    lastY = event.clientY;
                    document.body.classList.remove('hidden-cursor');
                    clearTimeout(timer);

                    timer = setTimeout(() => {
                        document.body.classList.add('hidden-cursor');
                        self.mouse = true; //开启翻页
                    }, 3000); // 3秒内无鼠标移动则隐藏光标
                });

                // this.startAutoSwitch(); //衔接平均时长自动轮播
                this.startAutoSwitch2(); //昨日手术间使用率轮播
                this.startAutoSwitch3(); //翻页
                this.tyOperaCountAutoSwitch();//昨日、今日手术科室手术量轮播效果

                this.dayContinuousConnectionTimeRangeCount(); //获取连台平均时长数据
                this.dayAnesthesiaConnectionTimeRangeCount()//麻醉衔接平均时长数据
                this.dayPatientWaitingTimeRangeCount(); //获取患者等待平均时长数据
                this.dayOperationConnectionTimeRangeCount(); //获取手术室衔接平均时长数据
                // this.getChangesInOperVolume("all");//近期全院总量
                // this.getCaseUtilizationRateCaseRooms()
                // this.initEcharts(); // 昨日手术间使用率

                // this.firstOperStartTimeDistribution()//首台开台时间分布
                this.getHospitalNo();
                //昨日数据查询  1 小时 1次
                // setInterval(() => {
                // this.getInfoOfLastOutRoom(); //准点结束
                // this.getTurnOverTime(); //翻台
                // this.getCaseUtilizationRateCaseRooms(); // 昨日手术间使用率

                // }, 3600000)

                //实时查询 1分钟 1次
                setInterval(() => {
                    this.getOperInfoCount();
                    this.getOperInfoCountTao(); //手术信息
                    // this.getInfoOfOperRoom(); //手术室信息

                }, 60000)


                setInterval(() => { //5分钟
                    // this.getFirstOpeningRate(); //准点开台
                    // // this.getFirstOpeningRate2(); //准点开台
                    // this.getKeynoteToday(); //重点关注
                    this.getInfoOfOpLevelCase(); //手术等级
                    this.getDurationTimeDistribution() //各种时长分布
                    this.getDurationTimeDistribution2()//患者等待平均时长

                }, 360000)

                // setInterval(() => { // 10s
                // this.getDepartmentOper(); //科室  择期手术
                // }, 10000)
                setTimeout(() => {
                    // this.startAlternating(); //自动变化
                    this.connectionAverageTimeChart() //连台衔接平均时长
                    this.averageWaitingTimeForPatientsChart() //患者等待平均时长
                    this.averageTimeOfAnesthesiaTransitionChart()//麻醉衔接平均时长

                    this.averageTimeOfSurgicalConnectionChart() //手术衔接平均时长
                    // this.firstOpTimeDistributionChart()//首台手术开台时间分布


                    // this.endDraw();
                    // this.departmentDraw();
                    // this.multiColumnHistogram();
                    // this.opRoomUsageRate();
                    // this.initEcharts();

                    this.opRoomUsageRateWaterPolo();
                    // this.shouDraw();  //今日准点开台率
                    this.levelDraw();  	//左中 环图
                    this.operDraw1Draw();					//中上手术已完成百分环
                    this.operDraw2Draw();					//中上手术已完成百分环
                    // this.opTimeDistribution(this.opTimeDistributionData); //右下 - 首台手术开台时间分布


                }, 200)
                // this.click1();
                this.getOperInfoCount();
                this.getOperInfoCountTao();
                // this.getInfoOfOperRoom();
                // this.getKeynoteToday();
                // this.getFirstOpeningRate();
                // this.getFirstOpeningRate2();
                // this.getInfoOfLastOutRoom();
                // this.getTurnOverTime(); //昨日翻台
                // this.getDepartmentOper(); //择期手术
                this.getInfoOfOpLevelCase();
                this.getDurationTimeDistribution() //各种时长分布
                this.getDurationTimeDistribution2()//患者等待平均时长

                // this.getAllDepartmentInfo(); //获取所有科室信息
                this.getOverallUtilizationRateAllRooms(); 	//获取昨日全部手术间使用率
                this.getCaseUtilizationRateCaseRoomsNew();//昨日各手术间使用率
                this.getPastTwoDaysDepartmentOperCount();  //获取今日昨日手术量
                this.getSurgicalVolumeOutsideRegularHours(); //右中 本月常规工作时段外的手术量
                // this.getFirstOperStartTimeDistribution() //首台手术开台时间分布

                // this.initTaiDraw();
                setInterval(() => {
                    this.setNowTimes()
                }, 1000)

                // this.operDraw3Draw();


                // //首台数据 5秒切换
                // setInterval(() => {
                // 	if(this.hospitalNo=='SZC'){
                //
                // 	}
                // 	if(this.showShou){
                // 		this.showShou=false;
                // 		this.showShou2=true;
                // 		if(this.globalShou){
                // 			let self=this;
                // 			setTimeout(function(){
                // 				self.getFirstOpeningRate2();
                // 			},1000)
                //
                // 			this.globalShou=false;
                // 		}
                // 	}else{
                // 		this.showShou=true;
                // 		this.showShou2=false;
                // 	}
                // }, 10000)


                setTimeout(function () {
                    this.showShou2 = false;
                }, 1000)
                // this.initEcharts();

            },

            methods: {
                init() {
                    //测试接口
                    if (this.hospitalSwitch === "000") {
                        // this.MapSrc = "http://192.168.1.144:8848/hsmap/location_op_screen/index_screen.html?initZoom=10&mapMarginLeft=-50&mapMarginTop=-30"
                        this.httpUrl = "http://192.168.8.141:82"   // httpUrl:"http://172.19.44.5",// httpUrl: "http://172.19.44.9:81",// httpUrl:"http://172.29.1.16",
                        this.httpUrl2 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';//平均时长信息获取
                        this.httpUrl3 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayPatientWaitingTimeRangeCount';//患者等待详细信息

                    }
                    //华山西院接口
                    else if (this.hospitalSwitch === "001") {
                        // this.MapSrc = 'http://172.19.44.9:8080/location_op_screen/index_screen.html?initZoom=12&mapMarginLeft=-20&mapMarginTop=-30'
                        this.httpUrl = "http://172.19.44.5"
                        this.httpUrl2 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';//平均时长信息获取
                        this.httpUrl3 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayPatientWaitingTimeRangeCount';//患者等待详细信息

                    } else if (this.hospitalSwitch === "002") {
                        // this.MapSrc = "http://192.168.1.144:8848/hsmap/location_op_screen/index_screen.html?initZoom=10&mapMarginLeft=-50&mapMarginTop=-30"
                        this.httpUrl = "http://172.16.14.196:82"   // httpUrl:"http://172.19.44.5",// httpUrl: "http://172.19.44.9:81",// httpUrl:"http://172.29.1.16",
                        this.httpUrl2 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';//平均时长信息获取
                        this.httpUrl3 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayPatientWaitingTimeRangeCount';//患者等待详细信息

                    } else if (this.hospitalSwitch === "003") {
                        // this.MapSrc = "http://192.168.1.144:8848/hsmap/location_op_screen/index_screen.html?initZoom=10&mapMarginLeft=-50&mapMarginTop=-30"
                        this.httpUrl = "http://222.71.175.10:1111"   // httpUrl:"http://172.19.44.5",// httpUrl: "http://172.19.44.9:81",// httpUrl:"http://172.29.1.16",
                        this.httpUrl2 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';//平均时长信息获取
                        this.httpUrl3 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayPatientWaitingTimeRangeCount';//患者等待详细信息

                    } else if (this.hospitalSwitch === "004") {

                        this.httpUrl = "http://172.29.1.16:80"   // httpUrl:"http://172.19.44.5",// httpUrl: "http://172.19.44.9:81",// httpUrl:"http://172.29.1.16",
                        this.httpUrl2 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';//平均时长信息获取
                        this.httpUrl3 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayPatientWaitingTimeRangeCount';//患者等待详细信息

                    }
                    //北京积水潭
                    else if (this.hospitalSwitch === "005") {
                        this.httpUrl = "http://222.71.175.10:1111"   // httpUrl:"http://172.19.44.5",// httpUrl: "http://172.19.44.9:81",// httpUrl:"http://172.29.1.16",
                        this.httpUrl2 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';//平均时长信息获取
                        this.httpUrl3 = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayPatientWaitingTimeRangeCount';//患者等待详细信息
                        this.averageWaitingPatientsListXSite = ['0´', '10´', '20´', '30´', '40´', '50´', '60´+', ''];
                    }

                },

                //左上
                // //获取重点运营指标
                getFirstOpeningRate() {

                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/firstOpeReplacementRate';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            console.log("++++++++++++");
                            console.log(rep);
                            if (rep.code == '1') {
                                self.showList12 = true;
                                let firstOpeInfo = rep.firstOpeInfo;
                                self.OpenedOnSchedule = firstOpeInfo.OpenedOnSchedule; //准点开台数
                                self.UnitsToday = firstOpeInfo.UnitsToday; //今日首台数
                                self.OnTimeOperRate = firstOpeInfo.OnTimeOperRate; ////准点开台率

                                self.firstOpeReplacementCount = rep.firstOpeReplacementCount  //首台换台数
                                self.firstOpeReplacementRate = parseFloat(rep.firstOpeReplacementRate) //首台换台率   去掉%;
                                self.shouDraw();



                                // let dataList = rep.firstOpeInfo;
                                // if (dataList.length > 0) {
                                //     self.openingRateList2 = dataList;
                                //     if (dataList.length > 3) {
                                //         setTimeout(function () {
                                //             scrollToLocationFrist2();
                                //         }, 2000);
                                //
                                //     }
                                // }
                            } else {
                                self.showList12 = false;
                            }
                        }
                    })


                    // 	axios.get(url).then(response => {
                    // 		if (response.data) {
                    // 			console.log("++++++++++++");
                    // 			console.log(response.data);
                    // 			if (response.data.code == '1') {
                    // 				this.showList1 = true;
                    // 				let data = response.data.data1;
                    // 				this.OpenedOnSchedule = data.OpenedOnSchedule; //准点开台数
                    // 				this.UnitsToday = data.UnitsToday; //今日首台数
                    // 				this.OnTimeOperRate = data.OnTimeOperRate; ////准点开台率
                    // 				this.OnTimeOperRate1 = parseInt(data.OnTimeOperRate);
                    // 				this.shouDraw();
                    // 				let dataList = response.data.data;
                    // 				if (dataList.length > 0) {
                    // 					this.openingRateList = dataList;
                    // 					if (dataList.length > 3) {
                    // 						setTimeout(function () {
                    // 							scrollToLocationFrist();
                    // 						}, 2000);
                    //
                    // 					}
                    // 				}
                    // 			} else {
                    // 				this.showList1 = false;
                    // 			}
                    // 		}
                    // 	}).catch(err => {
                    // 		console.log('获取手术信息请求失败')
                    //
                    // 	})
                },
                // 今日准点开台率
                shouDraw() {
                    const shoucharts = echarts.init(document.getElementById('shouDraw'));
                    shoucharts.setOption({
                        grid: {
                            top: '22%',
                            right: '22%', //echarts离容器左侧的距离
                        },
                        series: [{
                            type: 'gauge',
                            startAngle: 180,
                            endAngle: 0,
                            min: 0,
                            max: 100,
                            splitNumber: 2,
                            center: ["47%", "40%"], // 默认全局居中
                            radius: '70%',// 仪表盘的在父级中所占的百分比 类似大小
                            itemStyle: {
                                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                    offset: 0,
                                    color: '#21ABB8'
                                },
                                {
                                    offset: 1,
                                    color: '#77E081'
                                }
                                ]),

                                shadowColor: '#5CFF36', //阴影
                                shadowBlur: 10,
                                shadowOffsetX: 2,
                                shadowOffsetY: 2,


                            },
                            progress: {//光
                                show: true,
                                roundCap: true,
                                width: 10
                            },
                            pointer: {
                                icon: 'path://M2090.36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616.194028 2092.44859,617.312956 L2096.90698,728.755929 C2097.05155,732.369577 2094.2393,735.416212 2090.62566,735.56078 C2090.53845,735.564269 2090.45117,735.566014 2090.36389,735.566014 L2090.36389,735.566014 C2086.74736,735.566014 2083.81557,732.63423 2083.81557,729.017692 C2083.81557,728.930412 2083.81732,728.84314 2083.82081,728.755929 L2088.2792,617.312956 C2088.32396,616.194028 2089.24407,615.30999 2090.36389,615.30999 Z',
                                length: '0%',
                                width: 16,
                                offsetCenter: [0, '5%']
                            },
                            axisLine: {
                                roundCap: true,
                                lineStyle: {
                                    width: 15, //条宽
                                    color: [
                                        [1, '#35363B'],
                                    ]
                                },
                            },
                            axisTick: {
                                show: false,
                                splitNumber: 2,
                                lineStyle: {
                                    width: 2,
                                    color: '#999'
                                }
                            },
                            splitLine: {
                                show: false,
                                length: 20,
                                lineStyle: {
                                    width: 2,
                                    color: '#999'
                                }
                            },
                            axisLabel: {
                                distance: 30,
                                color: '#999',
                                fontSize: 20,
                                show: false
                            },
                            title: {
                                show: false
                            },
                            detail: {
                                show: false
                            },
                            data: [{
                                value: this.OnTimeOperRate2
                            }]
                        }]
                    });
                    window.onresize = function () {
                        shoucharts.resize();
                    }
                },
                //翻页轮播效果
                changeButton3(index) {
                    if (index === "1") {
                        this.isActiveButton3 = !this.isActiveButton3;
                        this.isActiveButton4 = !this.isActiveButton4;

                        window.location.href = 'index.html?surgicalNumber=' + this.surgicalNumber;

                    }
                    else if (index === "2") {

                        this.isActiveButton4 = !this.isActiveButton4;
                        this.isActiveButton3 = !this.isActiveButton3;
                        window.location.href = 'index_Two.html?surgicalNumber=' + this.surgicalNumber;

                    }
                    this.buttonIndex = index;
                    // this.$refs.carousel.setActiveItem(index);
                    // this.connectionAverageTimeChart();
                    // this.initAverageTime()
                },
                startAutoSwitch3() {
                    // 清除之前的定时器
                    if (this.timer3) {
                        clearInterval(this.timer3);
                    }
                    // 设置新的定时器
                    this.timer3 = setInterval(() => {
                        if (this.mouse) {
                            this.buttonIndex = "1";
                            this.changeButton3(this.buttonIndex);
                        }

                    }, this.autoSwitchIntervalButton);
                },
                // stopAutoSwitch3() {
                //     // 停止自动切换
                //     if (this.timer3) {
                //         clearInterval(this.timer3);
                //         this.timer3 = null;
                //     }
                // },
                //平均时长轮播效果
                changeSlide(index) {
                    if (this.changeSlideSwitch) {
                        if (index == "1") {
                            this.showChart1 = true;
                            this.showChart2 = false;
                            this.showChart3 = false;
                            this.showChart4 = false;
                            this.titleChanges = "连台衔接平均时长";
                            this.AverageTime = this.connectionAverageTime;

                        }
                        else if (index == "2") {

                            this.showChart1 = false;
                            this.showChart2 = true;
                            this.showChart3 = false;
                            this.showChart4 = false;
                            this.titleChanges = "患者等待平均时长";
                            this.AverageTime = this.averageWaitingPatientsTime;

                        }
                        else if (index == "3") {
                            this.showChart1 = false;
                            this.showChart2 = false;
                            this.showChart3 = true;
                            this.showChart4 = false;
                            this.titleChanges = "麻醉衔接平均时长";
                            this.AverageTime = this.averageAnesthesiaTransitionTime;
                        }
                        else {
                            this.showChart1 = false;
                            this.showChart2 = false;
                            this.showChart3 = false;
                            this.showChart4 = true;

                            this.titleChanges = "手术衔接平均时长";

                            this.AverageTime = this.SurgicalConnectionAverageTime;

                        }

                        this.currentIndex = index;
                        // this.$refs.carousel.setActiveItem(index);
                        // this.connectionAverageTimeChart();
                        this.initAverageTime()
                    }

                },
                startAutoSwitch() {
                    if (this.changeSlideSwitch) {
                        // 清除之前的定时器
                        if (this.timer) {
                            clearInterval(this.timer);
                        }

                        // 设置新的定时器
                        this.timer = setInterval(() => {
                            this.currentIndex = (this.currentIndex === "1" ? "2" : (this.currentIndex === "2" ? "3" : (this.currentIndex === "3" ? "4" : "1")));
                            this.changeSlide(this.currentIndex);
                        }, this.autoSwitchInterval);
                    }

                },
                stopAutoSwitch() {
                    // 停止自动切换
                    if (this.timer) {
                        clearInterval(this.timer);
                        this.timer = null;
                    }
                },

                //昨日手术间使用率轮播效果 (点击圆点)
                changeRooms(index) {
                    this.operatingRoomUtilizationRate.xData = this.operatingRoomUtilizationRate['xData' + index];
                    this.operatingRoomUtilizationRate.yData = this.operatingRoomUtilizationRate['yData' + index];
                    this.RoomRateIndex = index;
                    // this.$refs.carousel.setActiveItem(index);
                    // this.connectionAverageTimeChart();
                    this.opRoomUsageRate();

                },

                //昨日手术间使用率轮播效果 (点击箭头右)
                changeRooms2() {
                    if (this.operatingRoomOptionsList.length <= 1) {
                        console.log("无需轮播");
                        // return;
                    } else {
                        // 将当前索引转为数字
                        const currentIndex = parseInt(this.RoomRateIndex);

                        // 计算下一个索引：使用取模运算实现循环
                        const nextIndex = (currentIndex % this.operatingRoomOptionsList.length) + 1;

                        // 更新索引并切换房间
                        this.RoomRateIndex = nextIndex.toString();
                        this.changeRooms(this.RoomRateIndex);
                    }
                },
                //昨日手术间使用率轮播效果 (点击箭头左)
                changeRooms3() {
                    if (this.operatingRoomOptionsList.length <= 1) {
                        console.log("无需轮播");
                        // return;
                    } else {
                        // 将当前索引转为数字
                        const currentIndex = parseInt(this.RoomRateIndex);
                        //计算上一个索引：实现循环
                        let prevIndex = currentIndex - 1
                        if (prevIndex === 0) {
                            prevIndex = this.operatingRoomOptionsList.length
                        }

                        // 更新索引并切换房间
                        this.RoomRateIndex = prevIndex.toString();
                        this.changeRooms(this.RoomRateIndex);
                    }
                },
                startAutoSwitch2() {
                    // 清除之前的定时器
                    if (this.timer2) {
                        clearInterval(this.timer2);
                    }

                    // 设置新的定时器
                    this.timer2 = setInterval(() => {
                        // 如果列表长度小于等于1，不需要轮播
                        if (this.operatingRoomOptionsList.length <= 1) {
                            console.log("无需轮播");
                            // return;
                        } else {
                            // 将当前索引转为数字
                            const currentIndex = parseInt(this.RoomRateIndex);

                            // 计算下一个索引：使用取模运算实现循环
                            const nextIndex = (currentIndex % this.operatingRoomOptionsList.length) + 1;

                            // 更新索引并切换房间
                            this.RoomRateIndex = nextIndex.toString();
                            this.changeRooms(this.RoomRateIndex);
                        }

                    }, this.autoSwitchInterval2);

                    // 设置新的定时器
                    // this.timer2 = setInterval(() => {
                    //     if (this.operatingRoomOptionsList.length === 1) {
                    //         console.log("无需轮播");
                    //     } else if (this.operatingRoomOptionsList.length === 2) {
                    //         this.RoomRateIndex = (this.RoomRateIndex === "1" ? "2" : "1");
                    //         this.changeRooms(this.RoomRateIndex);
                    //
                    //     } else if (this.operatingRoomOptionsList.length === 3) {
                    //         this.RoomRateIndex = (this.RoomRateIndex === "1" ? "2" : (this.RoomRateIndex === "2" ? "3" : "1"));
                    //         this.changeRooms(this.RoomRateIndex);
                    //     } else if (this.operatingRoomOptionsList.length === 4) {
                    //         this.RoomRateIndex = (this.RoomRateIndex === "1" ? "2" : (this.RoomRateIndex === "2" ? "3" : (this.RoomRateIndex === "3" ? "4" : "1")));
                    //         this.changeRooms(this.RoomRateIndex);
                    //     }

                    // if (this.operatingRoomOptionsList.length === 1) {
                    //     console.log("无需轮播");
                    // } else if (this.operatingRoomOptionsList.length === 2) {
                    //     this.RoomRateIndex = (this.RoomRateIndex === "partOne" ? "partTwo" : "partOne");
                    //     this.changeRooms(this.RoomRateIndex);
                    //
                    // } else if (this.operatingRoomOptionsList.length === 3) {
                    //     this.RoomRateIndex = (this.RoomRateIndex === "partOne" ? "partTwo" : (this.RoomRateIndex === "partTwo" ? "partThree" : "partOne"));
                    //     this.changeRooms(this.RoomRateIndex);
                    // } else if (this.operatingRoomOptionsList.length === 4) {
                    //     this.RoomRateIndex = (this.RoomRateIndex === "partOne" ? "partTwo" : (this.RoomRateIndex === "partTwo" ? "partThree" : (this.RoomRateIndex === "partThree" ? "partFour" : "partOne")));
                    //     this.changeRooms(this.RoomRateIndex);
                    // }

                    // }, this.autoSwitchInterval2);
                },
                stopAutoSwitch2() {
                    // 停止自动切换
                    if (this.timer2) {
                        clearInterval(this.timer2);
                        this.timer2 = null;
                    }
                },
                //昨日、今日手术科室手术量轮播效果
                tyOperaCountAutoSwitch() {
                    // 清除之前的定时器
                    if (this.tyOperaCountTimer) {
                        clearInterval(this.tyOperaCountTimer);
                    }
                    // 设置新的定时器
                    this.tyOperaCountTimer = setInterval(() => {
                        // 如果列表长度小于等于1，不需要轮播
                        if (this.tyOperaCountSwitchList.length <= 1) {
                            console.log("无需轮播");
                            // return;
                        } else {
                            // 将当前索引转为数字
                            const currentIndex = parseInt(this.tyOperaCountIndex);

                            // 计算下一个索引：使用取模运算实现循环
                            const nextIndex = (currentIndex % this.tyOperaCountSwitchList.length) + 1;

                            // 更新索引并切换房间
                            this.tyOperaCountIndex = nextIndex.toString();
                            this.tyOperaCountChangePart(this.tyOperaCountIndex);
                        }

                    }, this.tyOperaCountInterval);


                },
                tyOperaCountChangePart(index) {
                    this.tyOperaCountData.xData = this.tyOperaCountData['xData' + index];
                    this.tyOperaCountData.yDataToday = this.tyOperaCountData['yDataToday' + index];
                    this.tyOperaCountData.yDataYesterday = this.tyOperaCountData['yDataYesterday' + index];
                    this.tyOperaCountData.yDataSum = this.tyOperaCountData['yDataSum' + index];
                    this.tyOperaCountIndex = index;
                    this.multiColumnHistogram2();

                },
                tyOperaCountStopAutoSwitch() {
                    // 停止自动切换
                    if (this.tyOperaCountTimer) {
                        clearInterval(this.tyOperaCountTimer);
                        this.tyOperaCountTimer = null;
                    }
                },


                //获取医院编码
                getHospitalNo() {
                    const url = this.httpUrl + '/oriot_op/api/screenrPlanB/getHospitalCode';
                    axios.get(url).then(response => {
                        if (response.data) {
                            if (response.data.code == '1') {
                                // this.showList1=true;
                                this.hospitalNo = response.data.hospitalCode

                            }
                        }
                    }).catch(err => {
                        console.log('获取手术信息请求失败')

                    })
                },

                offMap() {
                    this.mapShow = false;
                },
                openMap() {
                    this.mapShow = true;
                },


                getQueryString(name) {
                    let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
                    let r = window.location.search.substr(1).match(reg);
                    if (r != null) {
                        return unescape(r[2]);
                    }
                    ;
                    return null;
                },

                fontSizeDraw(res) {
                    let docEl = document.documentElement,
                        clientWidth =
                            window.innerWidth ||
                            document.documentElement.clientWidth ||
                            document.body.clientWidth;
                    if (!clientWidth) return;
                    // 此处的3840 为设计稿的宽度，记得修改！
                    let fontSize = clientWidth / 3840;
                    return res * fontSize;
                },
                //左中
                initAverageTime() {
                    this.connectionAverageTimeChart()
                    this.averageWaitingTimeForPatientsChart()
                    this.averageTimeOfAnesthesiaTransitionChart()
                    this.averageTimeOfSurgicalConnectionChart()
                },
                //平均时长信息获取
                getDurationTimeDistribution2() {

                    // const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';
                    // const url = 'http://172.19.44.5:80/oriot_op/api/hs/pushDurationTime';
                    const url = this.httpUrl2;

                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep.data) {
                                console.log("+++++手术平均时长分布+++++++");
                                console.log(rep);
                                if (rep.code == '1') {
                                    self.showList12 = true;
                                    let data = rep.data;
                                    self.averageWaitingPatientsTime = data.todayPatientWaitingTime; //患者等待时长


                                }
                            }
                        },
                        error(rep) {
                            console.log(rep + "手术平均时长分布详细信息获取失败");
                        }
                    })
                },
                //平均时长信息获取
                getDurationTimeDistribution() {

                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pushDurationTime';

                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep.data) {
                                console.log("+++++手术平均时长分布+++++++");
                                console.log(rep);
                                if (rep.code == '1') {
                                    self.showList12 = true;
                                    let data = rep.data;
                                    // self.averageWaitingPatientsTime = data.todayPatientWaitingTime; //患者等待时长
                                    self.connectionAverageTime = data.todayContinuousConnectionTime; //连台衔接时长
                                    self.averageAnesthesiaTransitionTime = data.todayAnesthesiaConnectionTime; //麻醉衔接时长
                                    self.SurgicalConnectionAverageTime = data.todayOperationConnectionTime; //手术衔接时长

                                }
                            }
                        },
                        error(rep) {
                            console.log(rep + "手术平均时长分布详细信息获取失败");
                        }
                    })
                },
                //连台详细信息
                dayContinuousConnectionTimeRangeCount() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayContinuousConnectionTimeRangeCount';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep.data) {
                                console.log("+++++连台衔接平均时长详细信息+++++++");
                                console.log(rep);
                                if (rep.code == '1') {
                                    self.showList12 = true;
                                    let data = rep.data;

                                    self.connectionAverageTimeList = [data.zeroToFive, data.fiveToTen, data.tenToFifteen, data.fifteenToTwenty, data.twentyToTwentyFive, data.twentyFiveToThirty, data.ThirtyPlus]
                                    let num = Math.max(...self.connectionAverageTimeList);
                                    self.yAxisMax1 = Math.round(num / 10) * 10 + 10;
                                    // connectionAverageTimeList:[],
                                    //     averageWaitingPatientsList:[],
                                    //     averageAnesthesiaTransitionTimeList:[],
                                    //     SurgicalConnectionAverageTimeList:[],

                                }
                            }
                            self.connectionAverageTimeChart();
                        },
                        error(rep) {
                            console.log(rep + "连台衔接平均时长详细信息获取失败");
                        }
                    })
                },
                //患者等待详细信息
                dayPatientWaitingTimeRangeCount() {
                    // const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayPatientWaitingTimeRangeCount';
                    // const url = 'http://172.19.44.5:80/oriot_op/api/hs/dayPatientWaitingTimeRangeCountInfo';
                    const url = this.httpUrl3;

                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep.data) {
                                console.log("+++++患者等待平均时长详细信息+++++++");
                                console.log(rep);
                                if (rep.code == '1') {
                                    self.showList12 = true;
                                    let data = rep.data;

                                    self.averageWaitingPatientsList = [data.zeroToFive, data.fiveToTen, data.tenToFifteen, data.fifteenToTwenty, data.twentyToTwentyFive, data.twentyFiveToThirty, data.ThirtyPlus]
                                    let num = Math.max(...self.averageWaitingPatientsList);
                                    self.yAxisMax2 = Math.round(num / 10) * 10 + 10;
                                }
                            }
                            self.averageWaitingTimeForPatientsChart();
                        },
                        error(rep) {
                            console.log(rep + "患者等待平均时长详细信息获取失败");
                        }
                    })
                },
                //麻醉平均时长详细信息
                dayAnesthesiaConnectionTimeRangeCount() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayAnesthesiaConnectionTimeRangeCount';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep.data) {
                                console.log("+++++连台衔接平均时长详细信息+++++++");
                                console.log(rep);
                                if (rep.code == '1') {
                                    self.showList12 = true;
                                    let data = rep.data;

                                    self.averageAnesthesiaTransitionTimeList = [data.zeroToFive, data.fiveToTen, data.tenToFifteen, data.fifteenToTwenty, data.twentyToTwentyFive, data.twentyFiveToThirty, data.ThirtyPlus]
                                    let num = Math.max(...self.averageAnesthesiaTransitionTimeList);
                                    self.yAxisMax3 = Math.round(num / 10) * 10 + 10;

                                }
                            }
                            self.averageTimeOfAnesthesiaTransitionChart();
                        },
                        error(rep) {
                            console.log(rep + "连台衔接平均时长详细信息获取失败");
                        }
                    })
                },

                //手术衔接详细信息
                dayOperationConnectionTimeRangeCount() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/dayOperationConnectionTimeRangeCount';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep.data) {
                                console.log("+++++连台衔接平均时长详细信息+++++++");
                                console.log(rep);
                                if (rep.code == '1') {
                                    self.showList12 = true;
                                    let data = rep.data;

                                    self.SurgicalConnectionAverageTimeList = [data.zeroToFive, data.fiveToTen, data.tenToFifteen, data.fifteenToTwenty, data.twentyToTwentyFive, data.twentyFiveToThirty, data.ThirtyPlus]
                                    let num = Math.max(...self.SurgicalConnectionAverageTimeList);
                                    self.yAxisMax4 = Math.round(num / 10) * 10 + 10;
                                }
                            }
                            self.averageTimeOfSurgicalConnectionChart();
                        },
                        error(rep) {
                            console.log(rep + "连台衔接平均时长详细信息获取失败");
                        }
                    })
                },
                // -连台衔接时长UI
                connectionAverageTimeChart() {
                    this.AverageTime = this.connectionAverageTime;

                    const chartContainer = echarts.init(this.$refs.connectionAverageTimeChart);
                    chartContainer.clear();
                    chartContainer.setOption({

                        grid: {
                            top: "15%",
                            bottom: "15%",
                            left: "5%",
                            right: "5%",
                            containLabel: true,
                        },
                        xAxis: [{
                            type: 'category',
                            // data: ['0', '5', '10', '15', '20', '25', '30´+'],

                            show: false,

                        }, {
                            type: 'category',
                            data: ['0´', '5´', '10´', '15´', '20´', '25´', '30´+', ''],
                            //横坐标实线
                            axisLine: {
                                show: false,
                            },

                            axisTick: {
                                show: false, // 不显示坐标轴刻度线
                                alignWithLabel: true
                            },

                            splitLine: {
                                show: false, // 不显示网格线
                            },
                            axisLabel: {
                                textStyle: {
                                    fontSize: 13,
                                    color: '#B0B8CD'
                                },
                                // formatter:'{value}´',
                                // padding:[2,2,2,2] //x轴文字偏移
                            },
                            boundaryGap: false,

                            position: 'bottom'
                        }],

                        yAxis: {
                            show: true,
                            type: 'value',
                            // interval: 10,
                            min: this.yAxisMin,
                            max: this.yAxisMax1,
                            boundaryGap: [0, '1%'],

                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: 'rgba(60, 66, 84, 1)'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 11,
                                    color: 'rgba(176, 184, 205, 1)'
                                },
                                show: false,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        series: [{
                            data: this.connectionAverageTimeList,
                            // data: [11, 0, 32, 31, 28, 13, 22],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            barWidth: "100%",
                            barMaxWidth: "25", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50
                            barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                                // shadowColor: '#007CD3', //阴影
                                // shadowBlur: 10,
                                // shadowOffsetX: 2,
                                // shadowOffsetY: 2,


                            },
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                offset: 0,
                                color: 'rgba(0, 124, 211, 0)'
                            },
                            {
                                offset: 1,
                                color: 'rgba(0, 124, 211,0.7)'
                            }
                            ]),
                            label: {
                                show: true, // 显示标签
                                position: 'top', // 标签位置
                                formatter: '{c}台', // 标签内容
                                fontSize: 10,
                                color: 'rgb(255,255,255,1)',
                            },


                        },
                        {
                            data: [0, 0, 0, 0, 0, 0, 0],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            // barWidth:"100%",
                            barMaxWidth: "25", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50
                            barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                            },
                            color: 'rgba(0, 124, 211,1)',
                            label:
                            {
                                show: true, // 显示标签
                                position: ['0%', -3],
                                width: 25,
                                height: 4,
                                borderRadius: 0,
                                color: 'rgba(0,0,0,0)',
                                backgroundColor: 'rgba(0, 124, 211,1)',
                                // shadowBlur: 6,
                                // shadowColor: 'rgba(0, 124, 211,1)',
                            },

                        },
                        ]
                    });
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                chartContainer.resize()
                            }, 100)
                        },
                        false,
                    )
                },
                // -患者等待平均时长UI
                averageWaitingTimeForPatientsChart() {
                    const chartContainer = echarts.init(this.$refs.averageWaitingTimeForPatientsChart);
                    chartContainer.clear();

                    chartContainer.setOption({

                        grid: {
                            top: "15%",
                            bottom: "15%",
                            left: "5%",
                            right: "5%",
                            containLabel: true,
                        },
                        xAxis: [{
                            type: 'category',
                            // data: ['0', '5', '10', '15', '20', '25', '30´+'],

                            show: false,

                        }, {
                            type: 'category',
                            data: this.averageWaitingPatientsListXSite,
                            //横坐标实线
                            axisLine: {
                                show: false,
                            },

                            axisTick: {
                                show: false, // 不显示坐标轴刻度线
                                alignWithLabel: true
                            },
                            splitLine: {
                                show: false, // 不显示网格线
                            },
                            axisLabel: {
                                textStyle: {
                                    fontSize: 13,
                                    color: '#B0B8CD'
                                },
                                // formatter:'{value}´',
                                // padding:[2,2,2,2] //x轴文字偏移
                            },
                            boundaryGap: false,

                            position: 'bottom'
                        }],

                        yAxis: {
                            show: true,
                            type: 'value',
                            // interval: 10,
                            min: this.yAxisMin,
                            max: this.yAxisMax2,

                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: 'rgba(60, 66, 84, 1)'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 11,
                                    color: 'rgba(176, 184, 205, 1)'
                                },
                                show: false,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        series: [{
                            data: this.averageWaitingPatientsList,
                            // data: [23, 40, 32,33, 22, 12, 23],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            barWidth: "100%",
                            barMaxWidth: "25", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50
                            barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                                // shadowColor: '#007CD3', //阴影
                                // shadowBlur: 10,
                                // shadowOffsetX: 2,
                                // shadowOffsetY: 2,


                            },
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                offset: 0,
                                color: 'rgba(48, 224, 161, 0)'
                            },
                            {
                                offset: 1,
                                color: 'rgba(48, 224, 161, 0.6)'
                            }
                            ]),
                            label: {
                                show: true, // 显示标签
                                position: 'top', // 标签位置
                                formatter: '{c}台', // 标签内容
                                fontSize: 10,
                                color: 'rgb(255,255,255,1)',
                            },


                        },
                        {
                            // data: this.overTimeListY,
                            data: [0, 0, 0, 0, 0, 0, 0],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            // barMaxWidth: "30", //设置每根柱条最大宽度为50
                            // barMinHeight: "0", //设置每根柱条最小高度为50
                            // barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                            },
                            color: 'rgba(48, 224, 161, 1)',
                            label:
                            {
                                show: true, // 显示标签
                                position: ['0%', -3],
                                width: 25,
                                height: 4,
                                borderRadius: 0,
                                color: 'rgba(0,0,0,0)',
                                backgroundColor: 'rgba(48, 224, 161, 1)',
                                // shadowBlur: 6,
                                // shadowColor: 'rgba(48, 224, 161, 1)',
                            },

                        },
                        ]
                    });
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                chartContainer.resize()
                            }, 100)
                        },
                        false,
                    )
                },
                // -麻醉衔接平均时长UI
                averageTimeOfAnesthesiaTransitionChart() {
                    const chartContainer = echarts.init(this.$refs.averageTimeOfAnesthesiaTransitionChart);
                    chartContainer.clear();

                    chartContainer.setOption({

                        grid: {
                            top: "15%",
                            bottom: "15%",
                            left: "5%",
                            right: "5%",
                            containLabel: true,
                        },
                        xAxis: [{
                            type: 'category',
                            // data: ['0', '5', '10', '15', '20', '25', '30´+'],

                            show: false,

                        }, {
                            type: 'category',
                            data: ['0´', '5´', '10´', '15´', '20´', '25´', '30´+', ''],
                            //横坐标实线
                            axisLine: {
                                show: false,
                            },

                            axisTick: {
                                show: false, // 不显示坐标轴刻度线
                                alignWithLabel: true
                            },
                            splitLine: {
                                show: false, // 不显示网格线
                            },
                            axisLabel: {
                                textStyle: {
                                    fontSize: 13,
                                    color: '#B0B8CD'
                                },
                                // formatter:'{value}´',
                                // padding:[2,2,2,2] //x轴文字偏移
                            },
                            boundaryGap: false,

                            position: 'bottom'
                        }],

                        yAxis: {
                            show: true,
                            type: 'value',
                            // interval: 10,
                            min: this.yAxisMin,
                            max: this.yAxisMax3,

                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: 'rgba(60, 66, 84, 1)'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 11,
                                    color: 'rgba(176, 184, 205, 1)'
                                },
                                show: false,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        series: [{
                            data: this.averageAnesthesiaTransitionTimeList,
                            // data: [33, 30, 32,11, 11, 22, 11],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            barWidth: "100%",
                            barMaxWidth: "25", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50
                            barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                                // shadowColor: '#007CD3', //阴影
                                // shadowBlur: 10,
                                // shadowOffsetX: 2,
                                // shadowOffsetY: 2,


                            },
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                offset: 0,
                                color: 'rgba(58, 201, 206, 0)'
                            },
                            {
                                offset: 1,
                                color: 'rgba(58, 201, 206, 0.6)'
                            }
                            ]),
                            label: {
                                show: true, // 显示标签
                                position: 'top', // 标签位置
                                formatter: '{c}台', // 标签内容
                                fontSize: 10,
                                color: 'rgb(255,255,255,1)',
                            },


                        },
                        {
                            data: [0, 0, 0, 0, 0, 0, 0],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            // barMaxWidth: "30", //设置每根柱条最大宽度为50
                            // barMinHeight: "0", //设置每根柱条最小高度为50
                            // barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                            },
                            color: 'rgba(58, 201, 206, 1)',
                            label:
                            {
                                show: true, // 显示标签
                                position: ['0%', -3],
                                width: 25,
                                height: 4,
                                borderRadius: 0,
                                color: 'rgba(0,0,0,0)',
                                backgroundColor: 'rgba(58, 201, 206, 1)',
                                // shadowBlur: 6,
                                // shadowColor: 'rgba(58, 201, 206, 1)',
                            },

                        },
                        ]
                    });
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                chartContainer.resize()
                            }, 100)
                        },
                        false,
                    )
                },
                // -手术衔接平均时长UI
                averageTimeOfSurgicalConnectionChart() {
                    const chartContainer = echarts.init(this.$refs.averageTimeOfSurgicalConnectionChart);
                    chartContainer.clear();

                    chartContainer.setOption({

                        grid: {
                            top: "15%",
                            bottom: "15%",
                            left: "5%",
                            right: "5%",
                            containLabel: true,
                        },
                        xAxis: [{
                            type: 'category',
                            // data: ['0', '5', '10', '15', '20', '25', '30´+'],

                            show: false,

                        }, {
                            type: 'category',
                            data: ['0´', '5´', '10´', '15´', '20´', '25´', '30´+', ''],
                            //横坐标实线
                            axisLine: {
                                show: false,
                            },

                            axisTick: {
                                show: false, // 不显示坐标轴刻度线
                                alignWithLabel: true
                            },
                            splitLine: {
                                show: false, // 不显示网格线
                            },
                            axisLabel: {
                                textStyle: {
                                    fontSize: 13,
                                    color: '#B0B8CD'
                                },
                                // formatter:'{value}´',
                                // padding:[2,2,2,2] //x轴文字偏移
                            },
                            boundaryGap: false,

                            position: 'bottom'
                        }],

                        yAxis: {
                            show: true,
                            type: 'value',
                            // interval: 10,
                            min: this.yAxisMin,
                            max: this.yAxisMax4,

                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: 'rgba(60, 66, 84, 1)'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 11,
                                    color: 'rgba(176, 184, 205, 1)'
                                },
                                show: false,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        series: [{
                            data: this.SurgicalConnectionAverageTimeList,
                            // data: [13, 20, 32,30, 21, 12, 21],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            barWidth: "100%",
                            barMaxWidth: "25", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50
                            barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                                // shadowColor: '#007CD3', //阴影
                                // shadowBlur: 10,
                                // shadowOffsetX: 2,
                                // shadowOffsetY: 2,


                            },
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                offset: 0,
                                color: 'rgba(38, 212, 255, 0)'
                            },
                            {
                                offset: 1,
                                color: 'rgba(38, 212, 255, 0.6)'
                            }
                            ]),
                            label: {
                                show: true, // 显示标签
                                position: 'top', // 标签位置
                                formatter: '{c}台', // 标签内容
                                fontSize: 10,
                                color: 'rgb(255,255,255,1)',
                            },


                        },
                        {
                            // data: this.overTimeListY,
                            data: [0, 0, 0, 0, 0, 0, 0],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            // barMaxWidth: "30", //设置每根柱条最大宽度为50
                            // barMinHeight: "0", //设置每根柱条最小高度为50
                            // barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                            },
                            color: 'rgba(38, 212, 255, 1)',
                            label:
                            {
                                show: true, // 显示标签
                                position: ['0%', -3],
                                width: 25,
                                height: 4,
                                borderRadius: 0,
                                color: 'rgba(0,0,0,0)',
                                backgroundColor: 'rgba(38, 212, 255, 1)',
                                // shadowBlur: 6,
                                // shadowColor: 'rgba(38, 212, 255, 1)',
                            },

                        },
                        ]
                    });
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                chartContainer.resize()
                            }, 100)
                        },
                        false,
                    )
                },


                //左下 -首台手术开台时间分布
                firstOperStartTimeDistribution() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/firstOperStartTimeDistribution';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        cache: false,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep.data) {
                                console.log("+++++-首台手术开台时间分布信息+++++++");
                                console.log(rep);
                                if (rep.code == '1') {
                                    self.showList12 = true;
                                    let data = rep.data;
                                    self.firstOpStartTimeDistributionList = [data.beforeEight, data.betweenEightAndHalfEight, data.betweenHalfEightAndNine, data.betweenNineAndHalfNine, data.betweenHalfNineAndTen, data.afterTen]
                                    let num = Math.max(...self.firstOpStartTimeDistributionList);

                                    self.yAxisMax5 = Math.round(num / 10) * 10 + 10;
                                }
                            }
                            self.firstOpTimeDistributionChart();
                        },
                        error(rep) {
                            console.log(rep + "-首台手术开台时间分布信息获取失败");
                        }
                    })
                },
                //UI
                firstOpTimeDistributionChart() {
                    const chartContainer = echarts.init(this.$refs.firstOpTimeDistributionChart);

                    chartContainer.setOption({

                        grid: {
                            top: "15%",
                            bottom: "15%",
                            left: "3%",
                            right: "4%",
                            containLabel: true,
                        },
                        xAxis: [{
                            type: 'category',
                            // data: ['0', '5', '10', '15', '20', '25', '30´+'],

                            show: false,

                        }, {
                            type: 'category',
                            data: ['8点以前', '8:00´', '8:30´', '9:00´', '9:30´', '10:00´', '10点以上'],
                            axisTick: {
                                show: false, // 不显示坐标轴刻度线
                                alignWithLabel: true
                            },
                            splitLine: {
                                show: false, // 不显示网格线
                            },
                            axisLabel: {
                                textStyle: {
                                    fontSize: 8,
                                    color: '#B0B8CD'
                                },
                                // formatter:'{value}´',
                                // padding:[2,2,2,2] //x轴文字偏移
                            },
                            boundaryGap: false,

                            position: 'bottom'
                        }],

                        yAxis: {
                            type: 'value',
                            // interval: 10,
                            min: this.yAxisMin,
                            max: this.yAxisMax5,

                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: '#282C38'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 10,
                                    color: 'rgba(176, 184, 205, 1)'
                                },
                                // show: false,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        series: [{
                            data: this.firstOpStartTimeDistributionList,
                            // data: [11, 35, 32, 31, 28, 13, 22],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            barMaxWidth: "30", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50
                            barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                                // shadowColor: '#2583c4', //阴影
                                // shadowBlur: 10,
                                // shadowOffsetX: 2,
                                // shadowOffsetY: 2,


                            },
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                offset: 0,
                                color: 'rgba(119, 224, 129, 0)'
                            },
                            {
                                offset: 1,
                                color: 'rgba(119,224,129,0.7)'
                            }
                            ]),
                            label:

                            {
                                show: true, // 显示标签
                                position: 'top', // 标签位置
                                formatter: '{c}', // 标签内容
                                fontSize: 10,
                                color: 'rgb(255,255,255,1)',
                            },
                        },
                        {
                            // data: this.overTimeListY,
                            data: [0, 0, 0, 0, 0, 0],
                            // data: datas,
                            type: 'bar',
                            stack: 'Total',
                            barMaxWidth: "30", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50
                            barGap: '10%',

                            itemStyle: {
                                barBorderRadius: [0, 0, 0, 0], // （顺时针左上，右上，右下，左下）
                            },
                            color: 'rgba(119, 224, 129, 1)',
                            label:
                            {
                                show: true, // 显示标签
                                position: ['0%', 0],
                                width: 30,
                                height: 3,
                                borderRadius: 0,
                                color: 'rgba(0,0,0,0)',
                                backgroundColor: 'rgba(119, 224, 129, 1)',
                                shadowBlur: 6,
                                shadowColor: 'rgba(119, 224, 129, 1)',
                            },

                        },

                        ]
                    });
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                chartContainer.resize()
                            }, 100)
                        },
                        false,
                    )
                },

                //中上手术已完成百分环
                operDraw1Draw() {

                    var oper1charts = echarts.init(document.getElementById('operDraw1'))
                    const gaugeData = [{
                        value: this.chooseCompleteRate,
                    },

                    ];
                    oper1charts.setOption({
                        series: [{
                            type: 'gauge',
                            startAngle: 90,
                            endAngle: -270,
                            pointer: {
                                show: false
                            },
                            itemStyle: {
                                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                    offset: 0,
                                    color: '#3AC9CE'
                                },
                                {
                                    offset: 1,
                                    color: '#007CD3'
                                }
                                ]),

                            },

                            progress: {
                                show: true,
                                overlap: false,
                                roundCap: true,
                                clip: false,
                                itemStyle: {
                                    borderWidth: 1,
                                },
                            },
                            axisLine: {
                                lineStyle: {
                                    width: 3,
                                    color: [
                                        [1, '#3C4254'],
                                    ]
                                },
                            },
                            splitLine: {
                                show: false,
                                distance: 0,
                                length: 10
                            },
                            axisTick: {
                                show: false
                            },
                            axisLabel: {

                                show: false,
                                distance: 50
                            },
                            data: gaugeData,
                            title: {
                                fontSize: 14
                            },

                            detail: {

                                show: false,
                                width: 50,
                                height: 14,
                                fontSize: 14,
                                color: 'inherit',
                                borderColor: 'inherit',
                                borderRadius: 20,
                                borderWidth: 1,
                                formatter: '{value}%'
                            }
                        }]
                    })
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                oper1charts.resize()
                            }, 100)
                        },
                        false,
                    )
                },
                //中上手术已完成百分环
                operDraw2Draw() {

                    var oper2charts = echarts.init(document.getElementById('operDraw2'))
                    const gaugeData1 = [{
                        value: this.emergencyCompleteRate,
                    },

                    ];
                    oper2charts.setOption({
                        series: [{
                            type: 'gauge',
                            startAngle: 90,
                            endAngle: -270,
                            pointer: {
                                show: false
                            },
                            itemStyle: {
                                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                    offset: 0,
                                    color: '#3AC9CE'
                                },
                                {
                                    offset: 1,
                                    color: '#007CD3'
                                }
                                ]),

                            },

                            progress: {
                                show: true,
                                overlap: false,
                                roundCap: true,
                                clip: false,
                                itemStyle: {
                                    borderWidth: 1,
                                },
                            },
                            axisLine: {
                                lineStyle: {
                                    width: 3,
                                    color: [
                                        [1, '#3C4254'],
                                    ]
                                },
                            },
                            splitLine: {
                                show: false,
                                distance: 0,
                                length: 10
                            },
                            axisTick: {
                                show: false
                            },
                            axisLabel: {

                                show: false,
                                distance: 50
                            },
                            data: gaugeData1,
                            title: {
                                fontSize: 14
                            },

                            detail: {

                                show: false,
                                width: 50,
                                height: 14,
                                fontSize: 14,
                                color: 'inherit',
                                borderColor: 'inherit',
                                borderRadius: 20,
                                borderWidth: 1,
                                formatter: '{value}%'
                            }
                        }]
                    })
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                oper2charts.resize()
                            }, 100)
                        },
                        false,
                    )
                },

                operDraw3Draw() {
                    //
                    // 	var oper3charts = echarts.init(document.getElementById('operDraw3'))
                    // 	const gaugeData1 = [{
                    // 		value: this.IsTemporaryCompleteRate,
                    // 	},
                    //
                    // 	];
                    // 	oper3charts.setOption({
                    // 		series: [{
                    // 			type: 'gauge',
                    // 			startAngle: 90,
                    // 			endAngle: -270,
                    // 			pointer: {
                    // 				show: false
                    // 			},
                    // 			itemStyle: {
                    // 				color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                    // 					offset: 0,
                    // 					color: '#3AC9CE'
                    // 				},
                    // 					{
                    // 						offset: 1,
                    // 						color: '#007CD3'
                    // 					}
                    // 				]),
                    //
                    // 			},
                    //
                    // 			progress: {
                    // 				show: true,
                    // 				overlap: false,
                    // 				roundCap: true,
                    // 				clip: false,
                    // 				itemStyle: {
                    // 					borderWidth: 1,
                    // 				},
                    // 			},
                    // 			axisLine: {
                    // 				lineStyle: {
                    // 					width: 5,
                    // 					color: [
                    // 						[1, '#3C4254'],
                    // 					]
                    // 				},
                    // 			},
                    // 			splitLine: {
                    // 				show: false,
                    // 				distance: 0,
                    // 				length: 10
                    // 			},
                    // 			axisTick: {
                    // 				show: false
                    // 			},
                    // 			axisLabel: {
                    //
                    // 				show: false,
                    // 				distance: 50
                    // 			},
                    // 			data: gaugeData1,
                    // 			title: {
                    // 				fontSize: 14
                    // 			},
                    //
                    // 			detail: {
                    //
                    // 				show: false,
                    // 				width: 50,
                    // 				height: 14,
                    // 				fontSize: 14,
                    // 				color: 'inherit',
                    // 				borderColor: 'inherit',
                    // 				borderRadius: 20,
                    // 				borderWidth: 1,
                    // 				formatter: '{value}%'
                    // 			}
                    // 		}]
                    // 	})
                },


                //中中  昨日手术间使用率

                //获取昨日全部手术间使用率
                getOverallUtilizationRateAllRooms() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/overallUtilizationRateAllRoomGet?date=yesterday&surgicalNumber=' + this.surgicalNumber;
                    let self = this;
                    $.ajax({
                        url,
                        type: 'get',
                        dataType: 'json',
                        // data: self.surgicalNumberData,
                        success(res) {
                            console.log("+++++获取昨日全部手术间使用率++++++++");
                            console.log(res);
                            if (res.code == '1') {
                                if (!(Object.keys(res.data).length === 0)) {
                                    let percent = parseFloat(res.data); // 先去掉百分号并转换为数字
                                    self.caseUtilizationRateCaseRoomsValue = percent / 100;// 转换为小数
                                    self.opRoomUsageRateWaterPolo();
                                }


                            }
                        },
                        error(err) {
                            console.log('获取昨日全部手术间使用率信息请求失败')
                        }
                    })

                },

                //获取昨日各手术间使用率
                // getCaseUtilizationRateCaseRooms() {
                //     return new Promise((resolve, reject) => {
                //         const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/caseUtilizationRateCaseRooms?surgicalNumber=001&date=yesterday';
                //         let self = this;
                //         $.ajax({
                //             url,
                //             type: 'post',
                //             dataType: 'json',
                //             data: JSON.stringify({ 'surgicalNumber': '001', 'date': "yesterday" }),
                //             cache: false,
                //             // 告诉jQuery不要去处理发送的数据
                //             processData: false,
                //             // 告诉jQuery不要去设置Content-Type请求头
                //             contentType: false,
                //             // data: JSON.stringify(),
                //             success(res) {
                //                 console.log("+++++昨日各手术间使用率++++++++");
                //                 console.log(res.data);
                //
                //                 if (res.code == '1') {
                //                     let partList = [];
                //                     let part1 = res.data[0].part1;
                //                     let part2 = res.data[1].part2;
                //                     let part3 = res.data[2].part3;
                //                     let part4 = res.data[3].part4;
                //                     partList.push(...part1);
                //                     partList.push(...part2);
                //                     partList.push(...part3);
                //                     partList.push(...part4);
                //                     let size = partList.length;
                //                     if (size <= 10) {
                //                         self.operatingRoomOptionsList = [
                //                             { value: ['partOne', "xData"] },
                //                         ]
                //                         part1 = partList;
                //                         part2 = [];
                //                         part3 = [];
                //                         part4 = [];
                //                     } else if (10 < size && size <= 20) {
                //                         self.operatingRoomOptionsList = [
                //                             { value: ['partOne', "xData"] },
                //                             { value: ['partTwo', "xData"] }
                //                         ]
                //                         part1 = partList.slice(0, 10);
                //                         part2 = partList.slice(10);
                //                         part3 = [];
                //                         part4 = [];
                //                     } else if (20 < size && size <= 30) {
                //                         self.operatingRoomOptionsList = [
                //                             { value: ['partOne', "xData"] },
                //                             { value: ['partTwo', "xData"] },
                //                             { value: ['partThree', "xData"] }
                //                         ]
                //                         part1 = partList.slice(0, 10);
                //                         part2 = partList.slice(10, 20);
                //                         part3 = partList.slice(20)
                //                         part4 = [];
                //                     } else if (30 < size && size <= 40) {
                //                         self.operatingRoomOptionsList = [
                //                             { value: ['partOne', "xData"] },
                //                             { value: ['partTwo', "xData"] },
                //                             { value: ['partThree', "xData"] },
                //                             { value: ['partFour', "xData"] },
                //
                //                         ]
                //                         part1 = partList.slice(0, 10);
                //                         part2 = partList.slice(10, 20);
                //                         part3 = partList.slice(20, 30)
                //                         part4 = partList.slice(30);
                //                     }
                //
                //                     console.log(part1)
                //
                //
                //                     if (!(part1.length === 0)) {
                //                         console.log(part1)
                //                         part1.forEach(item => {
                //                             // 移除所有非数字字符
                //                             let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                //                             // 将字符串转换为数字
                //                             let utilizationNumber = parseFloat(utilizationSrt);
                //                             self.operatingRoomUtilizationRate.yData1.push(utilizationNumber);
                //                             self.operatingRoomUtilizationRate.xData1.push(item.operRoomName);
                //                             self.operatingRoomUtilizationRate.xData = self.operatingRoomUtilizationRate.xData1;
                //                             self.operatingRoomUtilizationRate.yData = self.operatingRoomUtilizationRate.yData1;
                //                         })
                //                     }
                //                     if (!(part2.length === 0)) {
                //                         part2.forEach(item => {
                //                             // 移除所有非数字字符
                //                             let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                //                             // 将字符串转换为数字
                //                             let utilizationNumber = parseFloat(utilizationSrt);
                //                             self.operatingRoomUtilizationRate.yData2.push(utilizationNumber);
                //                             self.operatingRoomUtilizationRate.xData2.push(item.operRoomName);
                //
                //                         })
                //                     }
                //                     if (!(part3.length === 0)) {
                //                         part3.forEach(item => {
                //                             // 移除所有非数字字符
                //                             let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                //                             // 将字符串转换为数字
                //                             let utilizationNumber = parseFloat(utilizationSrt);
                //                             self.operatingRoomUtilizationRate.yData3.push(utilizationNumber);
                //                             self.operatingRoomUtilizationRate.xData3.push(item.operRoomName);
                //
                //                         })
                //                     }
                //                     if (!(part4.length === 0)) {
                //                         part4.forEach(item => {
                //                             // 移除所有非数字字符
                //                             let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                //                             // 将字符串转换为数字
                //                             let utilizationNumber = parseFloat(utilizationSrt);
                //                             self.operatingRoomUtilizationRate.yData4.push(utilizationNumber);
                //                             self.operatingRoomUtilizationRate.xData4.push(item.operRoomName);
                //
                //                         })
                //                     }
                //
                //                 }
                //                 self.opRoomUsageRate();
                //             },
                //             error(err) {
                //                 console.log('获取昨日各手术间使用率信息请求失败')
                //             }
                //         })
                //     })
                // },
                getCaseUtilizationRateCaseRoomsNew() {
                    return new Promise((resolve, reject) => {

                        // 获取当前日期
                        const currentDate = new Date();
                        // 设置为昨天的日期，将当前日期的天数减1
                        currentDate.setDate(currentDate.getDate() - 1);
                        // 获取年、月、日，并格式化为指定的字符串格式（注意月份需要加1，因为月份是从0开始计数的）
                        const year = currentDate.getFullYear();
                        const month = String(currentDate.getMonth() + 1).padStart(2, '0');
                        const day = String(currentDate.getDate()).padStart(2, '0');
                        const yesterday = `${year}-${month}-${day}`;

                        const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/caseUtilizationRateCaseRoomsNew';
                        let self = this;
                        $.ajax({
                            url,
                            type: 'post',
                            dataType: 'json',
                            data: JSON.stringify({ 'surgicalNumber': '001', 'date': yesterday, 'surgicalNumber': this.surgicalNumber }),
                            cache: false,
                            // 告诉jQuery不要去处理发送的数据
                            processData: false,
                            // 告诉jQuery不要去设置Content-Type请求头
                            contentType: false,
                            // data: JSON.stringify(),
                            success(res) {
                                console.log("+++++昨日各手术间使用率++++++++");
                                console.log(res.data);

                                if (res.code == '1') {
                                    let partList = res.data;
                                    // let part1 = [];
                                    // let part2 = [];
                                    // let part3 = [];
                                    // let part4 = [];
                                    if (partList.length > 0) {
                                        const size = Math.ceil(partList.length / 10);  // 向上取整
                                        for (let i = 1; i < size + 1; i++) {

                                            //每10个分组
                                            let part = partList.slice((i - 1) * 10, i * 10)
                                            //用于v-for
                                            self.operatingRoomOptionsList.push({ value: [i.toString(), "xData"] })
                                            console.log(part)

                                            let utilizationNumbers = [];
                                            let operRoomNames = [];
                                            part.forEach(item => {
                                                // 移除所有非数字字符
                                                let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                                                // 将字符串转换为数字
                                                utilizationNumbers.push(parseFloat(utilizationSrt));
                                                operRoomNames.push(item.operRoomName)

                                            })
                                            self.operatingRoomUtilizationRate['yData' + i] = utilizationNumbers;
                                            self.operatingRoomUtilizationRate['xData' + i] = operRoomNames;

                                        }
                                        //初始化渲染数据
                                        self.operatingRoomUtilizationRate.xData = self.operatingRoomUtilizationRate.xData1;
                                        self.operatingRoomUtilizationRate.yData = self.operatingRoomUtilizationRate.yData1;

                                    } else {
                                        //无数据时，设置标识符
                                        self.operatingRoomIsNull = true;
                                    }

                                    // if (size <= 10) {
                                    //     self.operatingRoomOptionsList = [
                                    //         { value: ['partOne', "xData"] },
                                    //     ]
                                    //     part1 = partList;
                                    //     part2 = [];
                                    //     part3 = [];
                                    //     part4 = [];
                                    // } else if (10 < size && size <= 20) {
                                    //     self.operatingRoomOptionsList = [
                                    //         { value: ['partOne', "xData"] },
                                    //         { value: ['partTwo', "xData"] }
                                    //     ]
                                    //     part1 = partList.slice(0, 10);
                                    //     part2 = partList.slice(10);
                                    //     part3 = [];
                                    //     part4 = [];
                                    // } else if (20 < size && size <= 30) {
                                    //     self.operatingRoomOptionsList = [
                                    //         { value: ['partOne', "xData"] },
                                    //         { value: ['partTwo', "xData"] },
                                    //         { value: ['partThree', "xData"] }
                                    //     ]
                                    //     part1 = partList.slice(0, 10);
                                    //     part2 = partList.slice(10, 20);
                                    //     part3 = partList.slice(20)
                                    //     part4 = [];
                                    // } else if (30 < size && size <= 40) {
                                    //     self.operatingRoomOptionsList = [
                                    //         { value: ['partOne', "xData"] },
                                    //         { value: ['partTwo', "xData"] },
                                    //         { value: ['partThree', "xData"] },
                                    //         { value: ['partFour', "xData"] },
                                    //
                                    //     ]
                                    //     part1 = partList.slice(0, 10);
                                    //     part2 = partList.slice(10, 20);
                                    //     part3 = partList.slice(20, 30)
                                    //     part4 = partList.slice(30);
                                    // }
                                    //
                                    // console.log(part1)
                                    //
                                    //
                                    // if (!(part1.length === 0)) {
                                    //     console.log(part1)
                                    //     part1.forEach(item => {
                                    //         // 移除所有非数字字符
                                    //         let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                                    //         // 将字符串转换为数字
                                    //         let utilizationNumber = parseFloat(utilizationSrt);
                                    //         self.operatingRoomUtilizationRate.yData1.push(utilizationNumber);
                                    //         self.operatingRoomUtilizationRate.xData1.push(item.operRoomName);
                                    //         self.operatingRoomUtilizationRate.xData = self.operatingRoomUtilizationRate.xData1;
                                    //         self.operatingRoomUtilizationRate.yData = self.operatingRoomUtilizationRate.yData1;
                                    //     })
                                    // }
                                    // if (!(part2.length === 0)) {
                                    //     part2.forEach(item => {
                                    //         // 移除所有非数字字符
                                    //         let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                                    //         // 将字符串转换为数字
                                    //         let utilizationNumber = parseFloat(utilizationSrt);
                                    //         self.operatingRoomUtilizationRate.yData2.push(utilizationNumber);
                                    //         self.operatingRoomUtilizationRate.xData2.push(item.operRoomName);
                                    //
                                    //     })
                                    // }
                                    // if (!(part3.length === 0)) {
                                    //     part3.forEach(item => {
                                    //         // 移除所有非数字字符
                                    //         let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                                    //         // 将字符串转换为数字
                                    //         let utilizationNumber = parseFloat(utilizationSrt);
                                    //         self.operatingRoomUtilizationRate.yData3.push(utilizationNumber);
                                    //         self.operatingRoomUtilizationRate.xData3.push(item.operRoomName);
                                    //
                                    //     })
                                    // }
                                    // if (!(part4.length === 0)) {
                                    //     part4.forEach(item => {
                                    //         // 移除所有非数字字符
                                    //         let utilizationSrt = item.utilizationRate.replace(/[^0-9.-]/g, '');
                                    //         // 将字符串转换为数字
                                    //         let utilizationNumber = parseFloat(utilizationSrt);
                                    //         self.operatingRoomUtilizationRate.yData4.push(utilizationNumber);
                                    //         self.operatingRoomUtilizationRate.xData4.push(item.operRoomName);
                                    //
                                    //     })
                                    // }

                                }
                                setTimeout(() => {
                                    self.opRoomUsageRate();

                                }, 1000)
                            },
                            error(err) {
                                console.log('获取昨日各手术间使用率信息请求失败')
                            }
                        })
                    })
                },
                //水球图
                opRoomUsageRateWaterPolo() {
                    var taicharts = echarts.init(document.getElementById('opRoomUsageRateWaterPolo'))

                    taicharts.setOption({

                        title: {
                            text: '全部手术间使用率',
                            textStyle: {
                                color: "#fdfdfd",
                                fontSize: 12
                            },
                            left: 'center',
                            bottom: '5 %'
                        },
                        series: [
                            {
                                name: '',
                                type: 'liquidFill',
                                radius: '60%', // 控制中间圆球的尺寸（此处可以理解为距离外圈圆的距离控制）
                                data: [{
                                    value: this.caseUtilizationRateCaseRoomsValue,
                                    direction: 'right',
                                    itemStyle: {

                                        normal: {
                                            color: new echarts.graphic.LinearGradient(0, 1, 1, 0, [{
                                                offset: 0,
                                                color: 'rgba(0, 124, 211, 1)',
                                            },
                                            {
                                                offset: 1,
                                                color: 'rgba(112, 220, 134, 1)'
                                            }]),
                                        },
                                    },
                                },
                                    // {
                                    //     value: this.caseUtilizationRateCaseRoomsValue,
                                    //     direction: 'left',
                                    //     itemStyle: {
                                    //         normal: {
                                    //             color: new echarts.graphic.LinearGradient(1,0,0,1,[{
                                    //                 offset:0,
                                    //                 color: 'rgba(0, 124, 211, .5)',
                                    //             },
                                    //                 {
                                    //                     offset: 1,
                                    //                     color:'rgba(112, 220, 134, .1)'
                                    //                 }]),
                                    //
                                    //         },
                                    //     },
                                    // },
                                ], // 这里填写要展示的百分比数据
                                label: {
                                    fontSize: 22,
                                },
                                backgroundStyle: {
                                    borderWidth: 1,
                                    color: 'rgb(31,47,79)' // 球体本景色
                                },
                                amplitude: '5%',//波浪的振幅
                                animationEasing: 'cubicInOut',
                                waveLength: '100%',
                                backgroundAnimation: true,
                                itemStyle: {
                                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                        offset: 0,
                                        color: '#3ae4d0'
                                    },
                                    {
                                        offset: 1,
                                        color: '#127798'
                                    }
                                    ]),
                                    borderWidth: 1,// 边框宽度
                                    borderColor: '#58d7e2' // 边框颜色
                                },
                                outline: {
                                    show: false
                                },
                            },
                            {
                                type: 'pie',
                                center: ['50%', '50%'],
                                radius: ['62%', '63.5%'], // 控制外圈圆的粗细

                                hoverAnimation: false,
                                data: [
                                    {
                                        name: '',
                                        value: 500,
                                        labelLine: {
                                            show: false
                                        },
                                        itemStyle: {
                                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                                                {
                                                    offset: 0,
                                                    color: 'rgba(0, 124, 211, 1)'
                                                },
                                                {
                                                    offset: 1,
                                                    color: 'rgba(58, 201, 206, 1)'
                                                }
                                            ])
                                        },
                                        emphasis: {
                                            labelLine: {
                                                show: false
                                            },
                                            itemStyle: {
                                                color: '#00AFFF'
                                            }
                                        }
                                    }
                                ]
                            },
                        ]

                    })
                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                taicharts.resize()
                            }, 100)
                        },
                        false,
                    )
                },


                //折线图  初始
                // initEcharts() {
                //     // const chartContainer = this.$refs.opRoomUsageRate1;
                //     // this.echartsInstance = echarts.init(chartContainer);
                //     // this.echartsInstance.showLoading() // 显示
                //     // this.getCaseUtilizationRateCaseRooms();
                //     this.opRoomUsageRate()
                // },
                //  echartsLoading() {
                //     // if (!(this.operatingRoomOptionsList.length > 0)) {
                //         const chartContainer = this.$refs.echartsLoading;
                //         this.echartsInstanceLoad = echarts.init(chartContainer);
                //         this.echartsInstanceLoad.showLoading({
                //             text: '加载中',
                //             color: '#e8d8d7',
                //             textColor: '#dfd6d6',
                //             maskColor: 'rgba(30, 31, 37, 1)',
                //             zlevel: 0,
                //         });
                //     // }
                //
                // },
                async opRoomUsageRate() {
                    const chartContainer = this.$refs.opRoomUsageRate1;
                    this.echartsInstance = echarts.init(chartContainer);
                    // this.echartsInstance.showLoading({
                    //     text: '加载中',
                    //     color: '#e8d8d7',
                    //     textColor: '#dfd6d6',
                    //     maskColor: 'rgba(30, 31, 37, 1)',
                    //     zlevel: 0,
                    // });
                    // 显示
                    if (!(this.operatingRoomOptionsList.length > 0)) {
                        // setTimeout(()=>{
                        // await this.getCaseUtilizationRateCaseRoomsNew();
                        // },10000)
                    }
                    // this.echartsInstance.clear();
                    // this.echartsInstance.hideLoading(); // 隐藏

                    // var taicharts = echarts.init(document.getElementById('opRoomUsageRate'))
                    // const seriesData = this.operatingRoomUtilizationRate[value[0]];
                    // const xAxisData = this.operatingRoomUtilizationRate[value[1]];
                    const seriesData = this.operatingRoomUtilizationRate.yData;
                    const xAxisData = this.operatingRoomUtilizationRate.xData;
                    this.echartsInstance.setOption({
                        grid: {
                            top: "15%",
                            bottom: "10%",
                            left: "5%",
                            right: "5%",
                            containLabel: true,
                        },
                        xAxis: {
                            type: 'category',
                            //横坐标实线
                            axisLine: {
                                show: false,
                            },

                            axisTick: {
                                show: false // 不显示坐标轴刻度线
                            },
                            splitLine: {
                                show: false // 不显示网格线
                            },
                            // data: this.overTimeListX,
                            // data: ['神经科', '内科', '显微科', '外科', '骨科', '内脏科'],
                            data: xAxisData,
                            axisLabel: {
                                fontSize: 10,// 设置横轴字体大小
                                color: 'rgba(176, 184, 205, 1)'
                            }
                        },
                        yAxis: {
                            type: 'value',
                            // min: 0,
                            // max: 100,
                            boundaryGap: [0, "10%"],
                            // interval: 20,
                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: 'rgba(60, 66, 84, 1)'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 11,
                                    color: 'rgba(176, 184, 205, 1)'
                                },
                                show: false,
                                formatter: '{value}%' //设置单位为m
                            }
                        },
                        series: [
                            {
                                name: "昨日手术间使用率",
                                // data: [40 / 40 * 100, 32 / 40 * 100, 31 / 40 * 100, 28 / 40 * 100, 15 / 40 * 100, 35 / 40 * 100],
                                // data: this.overTimeListY,
                                data: seriesData,
                                type: 'line',
                                smooth: true, //平滑曲线
                                lineStyle: {
                                    width: 6, // 设置曲线宽度
                                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                        offset: 0,
                                        color: '#103499'
                                    },
                                    {
                                        offset: 1,
                                        color: '#50deea'
                                    }
                                    ]),
                                },
                                itemStyle: {
                                    color: '#ffffff',
                                    borderColor: '#20679d', // 设置数据点边框颜色
                                    borderWidth: 8, // 设置数据点边框宽度
                                    backgroundColor: '#e4eaeb',
                                    borderType: "dashed",
                                },
                                symbol: "circle",
                                symbolSize: 4, // 设置数据点大小
                                areaStyle: {//对x轴投影
                                    normal: {
                                        opacity: 0.2,
                                        color: '#20679d'
                                    },
                                },
                                animationDelay(idx) {
                                    return idx * 10 + 100;
                                },
                                label: {
                                    show: true,
                                    position: 'top', // 标签位置在圆球上方
                                    // formatter: function (params) {
                                    //     return params.value; // 显示圆的数值
                                    // offset: [0, 10],
                                    padding: [3, 5],  //内边距
                                    // lineHeight: 20,//行高
                                    formatter: '{c}%', // 标签内容
                                    fontSize: 10,
                                    color: 'rgb(255,255,255,1)',
                                    backgroundColor: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                        offset: 0,
                                        color: 'rgba(56, 103, 117, 1)'
                                    },
                                    {
                                        offset: 1,
                                        color: 'rgba(36, 77, 113, 1)'
                                    }
                                    ]),
                                    borderRadius: 10,
                                    width: 25,
                                    height: 13,

                                },
                            },
                        ],
                    });

                    window.addEventListener("load", function () {
                        this.echartsInstance.resize()

                    })
                    // window.onload = function(){
                    //    this.echartsInstance.resize()
                    //
                    // }

                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                this.echartsInstance.resize()
                            }, 100)
                        },
                        false,
                    )

                },
                //各期下拉框事件
                // handleSelectChange(value) {
                //     this.selectedValue = value;
                //     // this.selectXAxisData = xData;
                //     // this.getCaseUtilizationRateCaseRooms(value);
                //     this.opRoomUsageRate();
                //
                // },


                //中下  昨日、今日手术科室手术量
                getPastTwoDaysDepartmentOperCount() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/pastTwoDaysDepartmentOperCount';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        success(res) {
                            console.log("+++++近期全院总体手术量变化++++++++");
                            console.log(res);
                            if (res.code == '1') {
                                let tyDepartmentName = [];
                                let todayData = [];
                                let yesterdayData = []
                                let partList = []

                                if (self.hospitalSwitch === '005' || self.hospitalSwitch === '001') {
                                    // 去除 今日昨日开台都为0的科室

                                    res.data.forEach(item => {
                                        if (item.todayCount !== "0" || item.yesterdayCount !== "0") {
                                            partList.push(item)
                                        }
                                    })

                                    const size = Math.ceil(partList.length / 8);  // 向上取整
                                    for (let i = 1; i < size + 1; i++) {

                                        //每10个分组
                                        let part = partList.slice((i - 1) * 8, i * 8)
                                        self.tyOperaCountSwitchList.push({ value: [i.toString(), "xData"] })
                                        console.log(part)

                                        let operaRoomNames = [];
                                        let todayNumbers = [];
                                        let yesterdayNumbers = [];
                                        let sum = [];
                                        part.forEach(item => {
                                            operaRoomNames.push(item.departmentName)
                                            // 将字符串转换为数字-parseFloat
                                            todayNumbers.push(parseFloat(item.todayCount))
                                            yesterdayNumbers.push(parseFloat(item.yesterdayCount));
                                            sum.push(parseFloat(item.todayCount) + parseFloat(item.yesterdayCount));

                                        })
                                        self.tyOperaCountData['xData' + i] = operaRoomNames;
                                        self.tyOperaCountData['yDataToday' + i] = todayNumbers;
                                        self.tyOperaCountData['yDataYesterday' + i] = yesterdayNumbers;
                                        self.tyOperaCountData['yDataSum' + i] = sum;


                                    }

                                    //初始化渲染数据
                                    self.tyOperaCountData.xData = self.tyOperaCountData.xData1;
                                    self.tyOperaCountData.yDataToday = self.tyOperaCountData.yDataToday1;
                                    self.tyOperaCountData.yDataYesterday = self.tyOperaCountData.yDataYesterday1;
                                    self.tyOperaCountData.yDataSum = self.tyOperaCountData.yDataSum1;


                                    self.multiColumnHistogram2()
                                } else {

                                    res.data.forEach(item => {
                                        tyDepartmentName.push(item.departmentName)
                                        todayData.push(parseFloat(item.todayCount))
                                        yesterdayData.push(parseFloat(item.yesterdayCount))

                                    })
                                    self.tydepartmentNameList = tyDepartmentName
                                    self.todayCountList = todayData;
                                    self.yesterdayCountList = yesterdayData;

                                    self.multiColumnHistogram()
                                }


                            }
                        },
                        error(err) {
                            console.log('获取近期全院总体手术量变化信息请求失败')
                        }
                    })

                },
                multiColumnHistogram2() {
                    var taicharts = echarts.init(document.getElementById('multiColumnHistogram'))
                    taicharts.clear();

                    // const xData = this.tydepartmentNameList.slice(0, 10);
                    // const todayData = this.todayCountList.slice(0, 10);
                    // const yesterdayData = this.yesterdayCountList.slice(0, 10);
                    const xData = this.tyOperaCountData.xData;
                    const todayData = this.tyOperaCountData.yDataToday;
                    const yesterdayData = this.tyOperaCountData.yDataYesterday;
                    const sum = this.tyOperaCountData.yDataSum;
                    taicharts.setOption({
                        grid: {
                            top: "25%",
                            bottom: "3%",
                            left: "3%",
                            right: "3%",
                            containLabel: true,
                        },
                        xAxis: {
                            type: 'category',
                            axisTick: {
                                show: false // 不显示坐标轴刻度线
                            },
                            splitLine: {
                                show: false // 不显示网格线
                            },
                            data: xData,
                            // data: ['神经科', '内科', '显微科', '外科', '骨科', '内脏科', '儿科', '耳科'],
                            axisLabel: {
                                fontSize: 10,// 设置横轴字体大小
                                color: '#B0B8CD',
                                rotate: 0, // 设置标签旋转角度，例如 45 度

                            }
                        },
                        yAxis: {
                            type: 'value',
                            // min: 0,
                            // max: 80,
                            // interval: 20,

                            boundaryGap: [0, "1%"],
                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: '#282C38'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 10,
                                    color: '#B0B8CD'
                                },
                                show: true,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        legend: {  //图例样式
                            orient: "horizontal",
                            top: "2%",
                            x: "90%",
                            y: "center",
                            itemWidth: 10,
                            itemHeight: 10,
                            data: ['今日', '昨日'],
                            textStyle: {
                                fontSize: 10,//字体大小
                                color: 'rgba(255,255,255,0.65)'//字体颜色
                            }

                        },
                        tooltip: {
                            trigger: 'axis',
                            backgroundColor: "rgba(0, 124, 211, 0.25)",
                            borderColor: 'rgba(0, 124, 211, 0.25)',
                            textStyle: {
                                color: '#FFFFFF',
                                lineHeight: 14,
                                fontSize: 12,
                                fontFamily: ' PingFang SC, PingFang SC',
                            },

                        },
                        series: [

                            {
                                name: "昨日",

                                // data: [40, 32, 31, 28, 15, 3,1,9],
                                type: 'bar',
                                stack: 'Total',
                                barMaxWidth: "30", //设置每根柱条最大宽度为50
                                // barMinHeight: 35, //设置每根柱条最小高度为50
                                // barWidth: '60%',
                                itemStyle: {
                                    color: '#0096FF',
                                    // borderColor: '#0096FF', // 设置数据点边框颜色
                                    // borderWidth: 5, // 设置数据点边框宽度
                                    // borderType: "dashed",
                                },
                                // label: {
                                //         show: true, // 显示标签
                                //         // position: 'top', // 标签位置
                                //         formatter: '{c}台', // 标签内容
                                //         fontSize: 10,
                                //         color: 'rgb(255,255,255,1)',
                                //     },

                                label: {

                                    normal: {
                                        color: '#fff',
                                        show: true,
                                        position: 'inside', // 数值显示外部/内部
                                        fontSize: 10,
                                        // lineStyle: {
                                        //     width: 2,
                                        //     align: 'left', // 设置文字对齐
                                        //
                                        // },
                                        // lineHeight: 26,
                                        //设置文字旋转角度
                                        // rotate: function (param) {
                                        //             // 计算当前数据项的角度
                                        //             const angle = param.value /  param.total *360;
                                        //             // 返回旋转角度，使文字与圆环角度适配
                                        //             return angle / 2;
                                        // },
                                        // formatter: '{c|{c}} ({d|{d}%})\n{hr|}\n{a|{a}}',

                                        formatter: function (params) {
                                            if (params.value < 2) {
                                                return '';
                                            } else {
                                                return params.value + '台';

                                            }

                                            // return params.name +  percentage + '\n'+params.value +"台";

                                        },
                                    },
                                },

                                emphasis: {
                                    focus: 'series'
                                },
                                data: yesterdayData,
                            },
                            {
                                name: '今日',

                                // data: [30, 22, 21, 18, 15, 5,4,8],
                                type: 'bar',
                                stack: 'Total',
                                barMaxWidth: "30", //设置每根柱条最大宽度为50
                                // barMinHeight:35, //设置每根柱条最小高度为50
                                // barWidth: '60%',
                                // itemStyle: {
                                //     height: (params) => params.data === 0 ? 35 : Math.max(params.data, 35)
                                // },
                                label: {
                                    show: true, // 显示标签
                                    // position: 'center', // 标签位置
                                    formatter: function (params) {
                                        if (params.value < 2) {
                                            return '';
                                        } else {
                                            return params.value + '台';
                                        }
                                    },
                                    fontSize: 10,
                                    color: 'rgb(255,255,255,1)',
                                },
                                emphasis: {
                                    focus: 'series'
                                },
                                data: todayData,

                                itemStyle: {
                                    color: '#30E0A1',
                                    // borderColor: '#30E0A1', // 设置数据点边框颜色
                                    // borderWidth: 5, // 设置数据点边框宽度
                                    // borderType: "dashed",
                                },
                                // symbol: "circle",
                                // symbolSize: 4,
                                // itemStyle: {
                                //     barBorderRadius: [50, 50, 0, 0], // （顺时针左上，右上，右下，左下）
                                // },
                                // color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                //     offset: 0,
                                //     color: '#3cc6cc',
                                // },
                                //     {
                                //         offset: 1,
                                //         color: '#45b152'
                                //     }
                                // ]),


                            },
                            {
                                name: '总数',
                                type: 'bar',
                                stack: 'sum',
                                barMaxWidth: "30", //设置每根柱条最大宽度为50
                                color: 'rgb(32,30,30,0)',
                                label: {
                                    normal: {
                                        show: true,
                                        position: 'top',
                                        formatter: '{c}',
                                        textStyle: { color: 'rgb(251,251,251)' }
                                    }
                                },
                                barMaxHeight: '0',
                                data: sum,
                                barGap: '-100%',
                                z: -1,
                            }
                            // {
                            //     name: "能量底条2",
                            //     data: todayData+yesterdayData,
                            //     type: 'bar',
                            //     stack: 'Total',
                            //     barMaxHeight:'0',
                            //     show:false,
                            //
                            //     // itemStyle: {
                            //     //     barBorderRadius: [50, 50, 0, 0], // （顺时针左上，右上，右下，左下）
                            //     // },
                            //     // color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            //     //     offset: 0,
                            //     //     color: '#3c4153'
                            //     // }]),
                            //     label: {
                            //         show: true, // 显示标签
                            //         position: 'top', // 标签位置
                            //         formatter: '{c}台', // 标签内容
                            //         fontSize: 10,
                            //         color: 'rgb(255,255,255,1)',
                            //     },
                            //
                            // },

                        ],

                    });

                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                taicharts.resize()
                            }, 100)
                        },
                        false,
                    )
                },

                multiColumnHistogram() {
                    var taicharts = echarts.init(document.getElementById('multiColumnHistogram'))
                    taicharts.clear();

                    const xData = this.tydepartmentNameList.slice(0, 10);
                    const todayData = this.todayCountList.slice(0, 10);
                    const yesterdayData = this.yesterdayCountList.slice(0, 10);

                    taicharts.setOption({
                        grid: {
                            top: "25%",
                            bottom: "0%",
                            left: "3%",
                            right: "3%",
                            containLabel: true,
                        },
                        xAxis: {
                            type: 'category',
                            axisTick: {
                                show: false // 不显示坐标轴刻度线
                            },
                            splitLine: {
                                show: false // 不显示网格线
                            },
                            data: xData,
                            // data: ['神经科', '内科', '显微科', '外科', '骨科', '内脏科', '儿科', '耳科'],
                            axisLabel: {
                                fontSize: 8,// 设置横轴字体大小
                                color: '#B0B8CD',
                                rotate: 20, // 设置标签旋转角度，例如 45 度

                            }
                        },
                        yAxis: {
                            type: 'value',
                            // min: 0,
                            // max: 80,
                            // interval: 20,

                            boundaryGap: [0, "1%"],
                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: '#282C38'
                                },
                            },
                            axisLabel: {

                                textStyle: {
                                    fontSize: 8,
                                    color: '#B0B8CD'
                                },
                                show: true,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        legend: {  //图例样式
                            orient: "horizontal",
                            top: "2%",
                            x: "90%",
                            y: "center",
                            itemWidth: 10,
                            itemHeight: 10,
                            data: ['昨日', '今日'],
                            textStyle: {
                                fontSize: 10,//字体大小
                                color: 'rgba(255,255,255,0.65)'//字体颜色
                            }

                        },
                        tooltip: {
                            trigger: 'axis',
                            backgroundColor: "rgba(0, 124, 211, 0.25)",
                            borderColor: 'rgba(0, 124, 211, 0.25)',
                            textStyle: {
                                color: '#FFFFFF',
                                lineHeight: 14,
                                fontSize: 12,
                                fontFamily: ' PingFang SC, PingFang SC',
                            },
                            axisPointer: {
                                type: 'line',
                                lineStyle: {
                                    color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                        offset: 0,
                                        color: 'rgba(0, 124, 211, 1)'
                                    },
                                    {
                                        offset: 1,
                                        color: 'rgba(58, 201, 206, 1)'
                                    }])
                                },

                            },
                            formatter: (params) => {
                                let result = '';
                                // result = params[0].todayCount +params.yesterdayCount;
                                params.forEach((item, i) => {
                                    const { seriesName, data, axisValue } = item;
                                    const color = seriesName === '昨日' ? 'rgba(0, 150, 255, 1)' : 'rgba(48, 224, 161, 1)';
                                    if (i === 0) {
                                        result += `${axisValue}<br/>`;
                                    }
                                    result += markDot(color) + `${seriesName} ${data}台<br/>`;
                                });

                                return result;
                            },
                        },
                        series: [

                            {
                                name: "昨日",
                                data: yesterdayData,
                                // data: [40, 32, 31, 28, 15, 3,1,9],
                                type: 'line',
                                stack: 'Total1',
                                // barMaxWidth: "10", //设置每根柱条最大宽度为50
                                // barMinHeight: "30", //设置每根柱条最小高度为50
                                lineStyle: {
                                    width: 3, // 设置曲线宽度
                                    color: "#0096FF",
                                },
                                itemStyle: {
                                    color: '#0096FF',
                                    borderColor: '#0096FF', // 设置数据点边框颜色
                                    borderWidth: 5, // 设置数据点边框宽度
                                    borderType: "dashed",
                                },
                                symbol: "circle",
                                symbolSize: 4, // 设置数据点大小
                                // areaStyle: {//对x轴投影
                                //     normal: {
                                //         opacity: 0.2,
                                //         color: '#20679d'
                                //     },
                                // },
                                // itemStyle: {
                                //     barBorderRadius: [50, 50, 0, 0], // （顺时针左上，右上，右下，左下）
                                // },
                                // color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                //     offset: 0,
                                //     color: '#37c1ce'
                                // },
                                //     {
                                //         offset: 1,
                                //         color: '#0372b9'
                                //     }
                                // ]),
                                // label: {
                                //     // 柱状图上方文本标签，默认展示数值信息
                                //     show: true,
                                //     position: "top"
                                // }

                                // label:{
                                //     show: true,
                                //     position: 'top', // 标签位置在圆球上方
                                //     // formatter: function (params) {
                                //     //     return params.value; // 显示圆的数值
                                //     // offset: [0, 10],
                                //     padding: [3, 5],  //内边距
                                //     // lineHeight: 20,//行高
                                //     formatter: '{c}', // 标签内容
                                //     fontSize:10,
                                //     color:"#0096FF",
                                //     // backgroundColor:new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                //     //     offset: 0,
                                //     //     color: 'rgba(56, 103, 117, 1)'
                                //     // },
                                //     //     {
                                //     //         offset: 1,
                                //     //         color: 'rgba(36, 77, 113, 1)'
                                //     //     }
                                //     // ]),
                                //     // borderRadius:10,
                                //     // width:25,
                                //     // height:13,
                                // },
                            },
                            // {
                            //     name: "能量底条",
                            //     data: [40, 40, 40, 40, 40, 40, 40, 40],
                            //     type: 'bar',
                            //     stack: 'Total1',
                            //     itemStyle: {
                            //         barBorderRadius: [50, 50, 0, 0], // （顺时针左上，右上，右下，左下）
                            //     },
                            //     color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            //         offset: 0,
                            //         color: '#3c4153'
                            //     }]),
                            // },

                            {
                                name: '今日',
                                data: todayData,
                                // data: [30, 22, 21, 18, 15, 5,4,8],
                                type: 'line',
                                stack: 'Total2',
                                // barMaxWidth: "10", //设置每根柱条最大宽度为50
                                // barMinHeight: "30", //设置每根柱条最小高度为50
                                lineStyle: {
                                    width: 3, // 设置曲线宽度
                                    color: "#30E0A1",
                                },
                                itemStyle: {
                                    color: '#30E0A1',
                                    borderColor: '#30E0A1', // 设置数据点边框颜色
                                    borderWidth: 5, // 设置数据点边框宽度
                                    borderType: "dashed",
                                },
                                symbol: "circle",
                                symbolSize: 4,
                                // itemStyle: {
                                //     barBorderRadius: [50, 50, 0, 0], // （顺时针左上，右上，右下，左下）
                                // },
                                // color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                //     offset: 0,
                                //     color: '#3cc6cc',
                                // },
                                //     {
                                //         offset: 1,
                                //         color: '#45b152'
                                //     }
                                // ]),


                            },

                            // {
                            //     name: "能量底条2",
                            //     data: [40, 40, 40, 40, 40, 40, 40, 40],
                            //     type: 'bar',
                            //     stack: 'Total2',
                            //     itemStyle: {
                            //         barBorderRadius: [50, 50, 0, 0], // （顺时针左上，右上，右下，左下）
                            //     },
                            //     color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            //         offset: 0,
                            //         color: '#3c4153'
                            //     }]),
                            // },
                        ],

                    });
                    // 生成大小一样样色不同的圆点
                    function markDot(color) {
                        return '<span style="' +
                            'display: inline-block;' +
                            'margin-right: .08rem;' +
                            'margin-bottom: .02rem;' +
                            'border-radius: .1rem;' +
                            'width: 0.4167vw;' +
                            'height: 0.7407vh;' +
                            `background-color: ${color}` +
                            '"></span>';
                    }

                    if (this.tydepartmentNameList.length < 11) {


                        let currentIndex = -1;
                        // 切换tooltip
                        this.timeLevel2 = setInterval(() => {
                            // 取消之前高亮的图形
                            taicharts.dispatchAction({
                                type: 'downplay',
                                seriesIndex: 1,
                                dataIndex: currentIndex,
                            });

                            currentIndex = (currentIndex + 1) % xData.length;

                            // 高亮当前图形
                            taicharts.dispatchAction({
                                type: 'highlight',
                                seriesIndex: 1,
                                dataIndex: currentIndex,
                            });
                            // 显示tooltip
                            taicharts.dispatchAction({
                                type: 'showTip',
                                seriesIndex: 1,
                                dataIndex: currentIndex,
                            });
                        }, 3000)
                    } else {
                        let currentIndex = -1;
                        let cursor = 10;   //从第11开始移动游标，到数组尾部从头开始
                        this.timeLevel2 = setInterval(() => {
                            currentIndex = xData.length - 1;

                            // 高亮当前图形
                            taicharts.dispatchAction({
                                type: 'highlight',
                                seriesIndex: 1,
                                dataIndex: currentIndex,
                            });
                            // 显示tooltip
                            taicharts.dispatchAction({
                                type: 'showTip',
                                seriesIndex: 1,
                                dataIndex: currentIndex,
                            });

                            todayData.shift();
                            todayData.push(this.todayCountList[cursor]);
                            yesterdayData.shift();
                            yesterdayData.push(this.yesterdayCountList[cursor]);

                            xData.shift();
                            xData.push(this.tydepartmentNameList[cursor]);
                            taicharts.setOption({
                                xAxis: [

                                    {
                                        data: xData
                                    }
                                ],
                                series: [
                                    {
                                        data: yesterdayData
                                    },
                                    {
                                        data: todayData
                                    }
                                ]
                            });

                            if (cursor === this.tydepartmentNameList.length - 1) {
                                cursor = 0;
                            } else {
                                cursor = cursor + 1;
                            }

                        }, 3000);
                    }



                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                taicharts.resize()
                            }, 100)
                        },
                        false,
                    )

                },



                //获取时间
                setNowTimes() {
                    let myDate = new Date()
                    let wk = myDate.getDay()
                    let yy = String(myDate.getFullYear())
                    let mm = myDate.getMonth() + 1
                    let dd = String(myDate.getDate() < 10 ? '0' + myDate.getDate() : myDate.getDate())
                    let hou = String(myDate.getHours() < 10 ? '0' + myDate.getHours() : myDate.getHours())
                    let min = String(myDate.getMinutes() < 10 ? '0' + myDate.getMinutes() : myDate.getMinutes())
                    let sec = String(myDate.getSeconds() < 10 ? '0' + myDate.getSeconds() : myDate.getSeconds())
                    let weeks = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
                    let week = weeks[wk]
                    this.nowDate = yy + '年' + mm + '月' + dd + '日 ' + week + ' '
                    this.nowTime = hou + ':' + min + ':' + sec
                },

                //获取手术信息
                getOperInfoCount() {
                    let self = this;
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/getOperPlanCount';

                    $.ajax({
                        url: url,//这里是请求后台的上传文件接口,本地
                        type: 'POST',
                        dataType: 'json',
                        cache: false,
                        data: self.surgicalNumberData,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(res) {
                            if (res.data) {
                                console.log("手术信息数量1+++++++++++++");
                                console.log(res.data);
                                if (res.code == '1') {
                                    let data = res.data;
                                    self.cancle = data.cancel; //取消数
                                    self.planCount = data.planCount; //今日全部计划数
                                    self.emergencyCount = data.emergencyCount; //急诊数
                                    self.ready = data.ready; //待开始数
                                    self.chooseCount = data.chooseCount; //择期数
                                    self.chooseFinished = data.chooseFinished; //择期已经完成数
                                    self.emergencyFinished = data.emergencyFinished; //紧急已经完成数
                                    self.planCountFinished = data.planCountFinished; //今日全部计划数已完成数
                                    self.emergencyCompleteRate = data.emergencyCompleteRate; //急诊数量的比例
                                    self.chooseCompleteRate = data.chooseCompleteRate; //择期数量的比例
                                    self.temporaryCount = data.temporaryCount; //// 临时数
                                    self.temporaryFinished = data.temporaryFinished; //临时完成数
                                    self.IsTemporaryCompleteRate = data.IsTemporaryCompleteRate; //临时完成率
                                    self.operDraw1Draw();
                                    self.operDraw2Draw();
                                }
                            }
                        }
                    })

                    // axios.post(url,{surgicalNumber: '001'}).then(response => {
                    // 	if (response.data) {
                    // 		console.log(response.data);
                    // 		console.log("手术信息数量1");
                    // 		if (response.data.code == '1') {
                    // 			let data = res.data;
                    // 			this.cancel = data.cancel; //取消数
                    // 			this.planCount = data.planCount; //今日全部计划数
                    // 			this.emergencyCount = data.emergencyCount; //急诊数
                    // 			this.ready = data.ready; //待开始数
                    // 			this.chooseCount = data.chooseCount; //择期数
                    // 			this.chooseFinished = data.chooseFinished; //择期已经完成数
                    // 			this.emergencyFinished = data.emergencyFinished; //紧急已经完成数
                    // 			this.planCountFinished = data.planCountFinished; //今日全部计划数已完成数
                    // 			this.emergencyCompleteRate = data.emergencyCompleteRate; //急诊数量的比例
                    // 			this.chooseCompleteRate = data.chooseCompleteRate; //择期数量的比例
                    // 			this.temporaryCount = data.temporaryCount; //// 临时数
                    // 			this.temporaryFinished = data.temporaryFinished; //临时完成数
                    // 			this.IsTemporaryCompleteRate = data.IsTemporaryCompleteRate; //临时完成率
                    // 			this.operDraw1Draw();
                    // 			this.operDraw2Draw();
                    // 		}
                    // 	}
                    // }).catch(err => {
                    // 	console.log('获取手术信息请求失败')
                    //
                    // })

                },

                //获取手术信息中间条
                getOperInfoCountTao() {
                    let self = this;
                    // const url = this.httpUrl + '/oriot_op/api/screenrPlanB/getStateX?surgicalNumber=' + this.surgicalNumber;
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/getStateX';
                    $.ajax({
                        url: url,//这里是请求后台的上传文件接口,本地
                        type: 'POST',
                        dataType: 'json',
                        cache: false,
                        data: self.surgicalNumberData,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(res) {
                            if (res.data) {
                                console.log(res.data);
                                console.log("4322222222222");
                                if (res.code == '1') {
                                    let data = res.data;
                                    self.cancle = data.cancle; //取消数
                                    self.opering = data.opering; //手术中数
                                    self.beforeOper = data.beforeOper; //术前数
                                    self.afterOper = data.afterOper //完成数
                                    let data1 = res.data1;
                                    let dataAll = self.planCount
                                    self.width4 = 6 + Number(data1.cancleRate) * 76; //取消数
                                    self.width3 = 6 + Number(data1.afterOperrate) * 76; //完成数
                                    self.width2 = 6 + Number(data1.operingrate) * 76; //手术中数
                                    self.width1 = 6 + Number(data1.beforeOperrate) * 76; //术前数
                                    // this.width4 = Number(data.cancel)/Number(dataAll) * 100; //取消数
                                    // this.width2 = Number(data.opering)/Number(dataAll) * 100; //手术中数
                                    // this.width1 = Number(data.beforeOper)/Number(dataAll)  * 100; //术前数
                                    // this.width3 = Number(data.afterOper)/Number(dataAll) * 100 ; //完成数
                                }
                            }
                        }
                    })


                    // axios.post(url,data).then(response => {
                    // 	if (response.data) {
                    // 		console.log(response.data);
                    // 		console.log("4322222222222");
                    // 		if (response.data.code == '1') {
                    // 			let data = response.data.data;
                    // 			this.cancel = data.cancel; //取消数
                    // 			this.opering = data.opering; //手术中数
                    // 			this.beforeOper = data.beforeOper; //术前数
                    // 			this.afterOper = data.afterOper //完成数
                    // 			let data1 = response.data.data1;
                    // 			let dataAll = this.planCount
                    // 			this.width4 = Number(data1.cancelrate) * 100; //取消数
                    // 			this.width3 = Number(data1.afterOperrate) * 100; //完成数
                    // 			this.width2 = Number(data1.operingrate) * 100; //手术中数
                    // 			this.width1 = Number(data1.beforeOperrate) * 100; //术前数
                    // 			// this.width4 = Number(data.cancel)/Number(dataAll) * 100; //取消数
                    // 			// this.width2 = Number(data.opering)/Number(dataAll) * 100; //手术中数
                    // 			// this.width1 = Number(data.beforeOper)/Number(dataAll)  * 100; //术前数
                    // 			// this.width3 = Number(data.afterOper)/Number(dataAll) * 100 ; //完成数
                    // 		}
                    // 	}
                    // }).catch(err => {
                    // 	console.log('获取手术信息请求失败')
                    //
                    // })
                },

                // //获取手术室使用情况
                // getInfoOfOperRoom() {
                // 	const url = this.httpUrl + '/oriot_op/api/screenrPlanB/getInfoOfOperRoom?surgicalNumber=' + this.surgicalNumber;
                // 	axios.get(url).then(response => {
                // 		if (response.data) {
                // 			console.log(response.data);
                // 			if (response.data.code == '1') {
                // 				let data = response.data.data;
                // 				this.waitRoom = data.wait; //等待接台
                // 				this.totalRoom = data.total; //房间总数
                // 				this.busyRoom = data.busy; //占用数
                // 				this.freeRoom = data.free; //空闲数
                // 			}
                // 		}
                // 	}).catch(err => {
                // 		console.log('获取手术信息请求失败')
                //
                // 	})
                // },


                //获取今日重点关注
                getKeynoteToday() {
                    // const url = this.httpUrl + '/oriot_op/api/screenrPlanB/getKeynoteToday?isHide=' + this.isHide + '&surgicalNumber=' + this.surgicalNumber;

                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/getKeynoteToday';
                    let self = this;
                    $.ajax({
                        url: url,//这里是请求后台的上传文件接口,本地
                        type: 'POST',
                        dataType: 'json',
                        cache: false,
                        data: self.surgicalNumberData,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(res) {
                            if (res.data) {
                                console.log(res);
                                if (res.code == '1') {
                                    self.showList5 = true;
                                    if (res.data1) {
                                        let data = res.data1;
                                        self.specialOper = data.SpecialOper; //特殊术式人数统计
                                        self.specialInfection = data.SpecialInfection; //特殊感染人数统计
                                        self.fourCount = data.fourCount; //四岁以下人数统计
                                        self.eightyCount = data.eightyCount; //八十岁以上人数统计

                                        let dataList = res.data;
                                        console.log(dataList);
                                        if (dataList.length > 0) {
                                            self.noteList = dataList;
                                            if (dataList.length > 3) {
                                                setTimeout(function () {
                                                    scrollToLocationNote();
                                                }, 3000);
                                            }

                                        }
                                    }

                                }
                            }
                        }
                    })


                    // axios.post(url,this.surgicalNumberData).then(response => {
                    // 	if (response.data) {
                    // 		console.log(response.data);
                    // 		if (response.data.code == '1') {
                    // 			this.showList5 = true;
                    // 			let data = response.data.data1;
                    // 			this.specialOper = data.SpecialOper; //特殊术式人数统计
                    // 			this.specialInfection = data.SpecialInfection; //特殊感染人数统计
                    // 			this.fourCount = data.fourCount; //四岁以下人数统计
                    // 			this.eightyCount = data.eightyCount; //八十岁以上人数统计
                    //
                    // 			let dataList = response.data.data;
                    // 			console.log(dataList);
                    // 			if (dataList.length > 0) {
                    // 				this.noteList = dataList;
                    // 				if (dataList.length > 3) {
                    // 					setTimeout(function () {
                    // 						scrollToLocationNote();
                    // 					}, 3000);
                    // 				}
                    //
                    // 			}
                    //
                    // 		} else {
                    // 			this.showList5 = false;
                    // 		}
                    // 	}
                    // }).catch(err => {
                    // 	console.log('获取手术信息请求失败')
                    //
                    // })
                },


                //获取今日手术等级
                getInfoOfOpLevelCase() {
                    // const url = this.httpUrl + '/oriot_op/api/screenrPlanB/getInfoOfOpLevel?surgicalNumber=' + this.surgicalNumber;

                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/getInfoOfOpLevelCase';
                    let self = this;
                    $.ajax({
                        url: url,
                        type: 'POST',
                        dataType: 'json',
                        cache: false,
                        data: self.surgicalNumberData,
                        // 告诉jQuery不要去处理发送的数据
                        processData: false,
                        // 告诉jQuery不要去设置Content-Type请求头
                        contentType: false,
                        success(rep) {
                            if (rep) {
                                if (rep.code == '1') {
                                    if (rep.data) {
                                        // rep.data[0]
                                        self.levelList = rep.data;

                                    }
                                    if (rep.data1) {
                                        let data = rep.data1;
                                        self.outputFourCount = data.outputFourCount;
                                        self.outputFour = data.outputFour;
                                        self.outputThreeCount = data.outputThreeCount;
                                        self.outputThree = data.outputThree;
                                        self.outputTwoCount = data.outputTwoCount;
                                        self.outputTwo = data.outputTwo;
                                        self.outputOneCount = data.outputOneTwoCount;
                                        self.outputOne = data.outputOne;
                                    }
                                    self.levelDraw();    					//左中 环图

                                }
                            }
                        }
                    })
                    // axios.post(url,this.surgicalNumberData).then(response => {
                    // 	if (response.data) {
                    // 		if (response.data.code == '1') {
                    // 			let dataList = response.data.data;
                    // 			this.levelList = dataList;
                    // 			this.levelDraw();
                    // 			let data = response.data.data1;
                    // 			this.outputFourCount = data.outputFourCount;
                    // 			this.outputFour = data.outputFour;
                    // 			this.outputThreeCount = data.outputThreeCount;
                    // 			this.outputThree = data.outputThree;
                    //
                    //
                    // 		}
                    // 	}
                    // }).catch(err => {
                    // 	console.log('获取手术信息请求失败')
                    //
                    // })
                },


                // //获取今日择期手术量
                // getDepartmentOper() {
                // 	const url = this.httpUrl + '/oriot_op/api/screenrPlanB/getDepartmentOper?page=' + this.pageDepartmentNow + '&surgicalNumber=' + this.surgicalNumber;
                // 	axios.get(url).then(response => {
                // 		if (response.data) {
                // 			console.log("++++++++++++科室信息");
                // 			console.log(response.data);
                // 			if (response.data.code == '1') {
                // 				let departmentOperY = response.data.data1;
                // 				let departmentOperX = response.data.data;
                // 				this.maxCountPart = response.data.maxCount;
                //
                // 				// if (departmentOperX.length<6) {
                // 				// 	for(let i=departmentOperX.length;i<6;i++){
                // 				// 		departmentOperX.push('');
                // 				// 	}
                // 				// }
                // 				// if (departmentOperY.length<6) {
                // 				// 	for(let i=departmentOperY.length;i<6;i++){
                // 				// 		departmentOperY.push('');
                // 				// 	}
                // 				// }
                // 				this.departmentOperY = departmentOperY.reverse();
                // 				this.departmentOperX = departmentOperX.reverse();
                // 				let departmentCount = response.data.totalcount;
                // 				console.log("departmentCount：" + departmentCount);
                // 				let page = 1;
                // 				if (departmentCount % 6 != 0) {
                // 					page = Math.floor(departmentCount / 6 + 1);
                // 				} else {
                // 					page = Number(departmentCount / 6);
                // 				}
                //
                //
                // 				if (this.pageDepartmentNow < page) { //当当前页小于最大页是  当前页+1
                // 					this.pageDepartmentNow++;
                // 				} else { //否则当前页为1
                // 					this.pageDepartmentNow = 1;
                // 				}
                // 				console.log("page：" + page);
                //
                // 				this.departmentDraw();
                // 			}
                // 		}
                // 	}).catch(err => {
                // 		console.log('获取手术信息请求失败')
                //
                // 	})
                // },
                //

                //结束统计图
                endDraw() {

                },

                // // 监测容器尺寸改变
                // observeResize () {
                // 	const or = new ResizeObserver(entries => {
                // 		clearTimeout(this.timer)
                //
                // 		this.timer = setTimeout(() => {
                // 			this.shouDraw && this.shouDraw.resize()
                // 		}, 100)
                // 	})
                //
                // 	or.observe(document.getElementById('shouDraw'))
                // },




                //获取所有科室信息
                getAllDepartmentInfo() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/allDepartmentInfo';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'post',
                        dataType: 'json',
                        data: self.surgicalNumberData,
                        success(res) {
                            console.log("+++++获取所有科室信息++++++++");
                            console.log(res.data);
                            if (res.code == '1') {
                                self.showList1 = true;
                                let data = [];
                                data.push({ departmentNumber: 'all', departmentName: '全院' })
                                res.data.forEach(item => {
                                    data.push(item)
                                })
                                self.departmentOptionsList = data;
                            }
                        },
                        error(err) {
                            console.log('获取获取所有科室信息请求失败')
                        }
                    })

                },
                //近期全院总体手术量变化
                getChangesInOperVolume(department) {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/changesInOperVolumeGY';
                    let self = this;
                    let param = {
                        departmentNumber: department,
                    };

                    // 将参数对象转换为JSON字符串
                    // let jsonData = JSON.stringify(param);
                    console.log("请求体内容:", param);  // 输出请求体内容

                    $.ajax({
                        url: url,
                        type: "POST",
                        // contentType: "application/json", // 设置Content-Type为application/json
                        dataType: 'json',
                        data: param, // 确保请求体为JSON字符串
                        success(res) {
                            console.log("+++++近期全院总体手术量变化++++++++");
                            console.log(res.data);

                            let operDateList = [];   //时间
                            let operCountList = [];   //数量

                            if (res.code == '1') {
                                let data = res.data;
                                data.forEach(item => {
                                    // 解析日期字符串
                                    const date = new Date(item.operDate);
                                    // 获取月份和日期
                                    const month = date.getMonth() + 1; // 月份是从 0 开始的，所以需要加 1
                                    const day = date.getDate();
                                    // 将月份和日期拼接成 "8.15" 这样的格式
                                    const formattedDate = `${month}.${day}`;
                                    console.log(formattedDate); // 输出 "8.15"

                                    operDateList.push(formattedDate)
                                    operCountList.push(item.operCount)
                                })
                                self.changesInOperVolumeChartData.department = operCountList
                                self.changesInOperVolumeChartDate = operDateList
                                self.initTaiDraw()
                            }
                        },
                        error(err) {
                            console.log('获取近期全院总体手术量变化信息请求失败');
                        }
                    });
                },


                //右上 近期全院手术量变化
                initTaiDraw() {
                    const chartContainer = this.$refs.changesInOperVolumeChart;
                    this.echartsInstance2 = echarts.init(chartContainer);
                    this.echartsInstance2.clear();
                    this.taiDraw();
                    // this.echartsInstance2.resize();

                },
                taiDraw() {

                    this.echartsInstance2.setOption({
                        grid: {
                            top: "15%",
                            bottom: "5%",
                            left: "6%",
                            right: "6%",
                            containLabel: true,
                        },
                        xAxis: {
                            type: 'category',
                            data: this.changesInOperVolumeChartDate,
                            // data: ['7.19', '7.20', '7.21', '7.22', '7.23', '7.24', '7.25'],
                            axisTick: {
                                show: false // 不显示坐标轴刻度线
                            },
                            splitLine: {
                                show: false // 不显示网格线
                            },
                            axisLabel: {
                                textStyle: {
                                    fontSize: 11,
                                    color: 'rgba(176, 184, 205, 1)'
                                },

                            }
                        },
                        yAxis: {
                            type: 'value',
                            boundaryGap: [0, '50%'],
                            // interval: 20,
                            // min: 0,
                            // max: 100,

                            splitLine: {
                                show: true,
                                lineStyle: {
                                    type: 'dashed',
                                    color: '#282C38'
                                },
                            },
                            axisLabel: {
                                textStyle: {
                                    fontSize: 11,
                                    color: 'rgba(176, 184, 205, 1)'
                                },
                                // show: false,
                                formatter: '{value}台' //设置单位为m
                            }
                        },
                        series: [{
                            // data: this.overTimeListY,
                            // data: [86, 62, 32, 31, 28, 15,33],
                            data: this.changesInOperVolumeChartData.department,
                            type: 'bar',
                            stack: 'Total',
                            barMaxWidth: "20", //设置每根柱条最大宽度为50
                            barMinHeight: "0", //设置每根柱条最小高度为50

                            itemStyle: {
                                barBorderRadius: [9, 9, 0, 0], // （顺时针左上，右上，右下，左下）
                            },
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                offset: 0,
                                color: 'rgba(0, 124, 211, 1)'
                            },
                            {
                                offset: 1,
                                color: 'rgba(59, 199, 207, 1)'
                            }
                            ]),
                            label: {
                                show: true, // 显示标签
                                position: 'top', // 标签位置
                                formatter: '{c}', // 标签内容
                                // fontWeight: 'bold',
                                fontSize: 10,
                                color: 'rgb(255,255,255,1)',
                                // borderWidth: 4
                            },

                            // markPoint: {
                            // 	symbol: 'pin',
                            // data: [{
                            // 		value: '86m',
                            // 		xAxis: 0,
                            // 		yAxis: 86
                            // 	},
                            // 	{
                            // 		value: '62m',
                            // 		xAxis: 1,
                            // 		yAxis: 62
                            // 	},
                            // 	{
                            // 		value: '32m',
                            // 		xAxis: 2,
                            // 		yAxis: 32
                            // 	},
                            // 	{
                            // 		value:'31m',
                            // 		xAxis: 3,
                            // 		yAxis: 31
                            // 	},
                            // 	{
                            // 		value: '28m',
                            // 		xAxis: 4,
                            // 		yAxis: 28
                            // 	},
                            // 	{
                            // 		value: '15m',
                            // 		xAxis: 5,
                            // 		yAxis: 15
                            // 	},
                            // ],
                            // data: this.pointList,
                            //
                            // symbolSize: 60,
                            //
                            // label: {
                            //    show: true,
                            //    fontSize: 20,
                            //    fontWeight: 'bold',
                            //    color: '#fff'
                            // },
                            // },

                        }]
                    });

                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                this.echartsInstance2.resize()
                            }, 100)
                        },
                        false,
                    )
                },
                // 近期全院总体手术量变化下拉框
                handleSelectChange2(value) {
                    // this.departmentOptions = value;
                    // this.selectXAxisData = xData;
                    this.getChangesInOperVolume(value);
                },


                //左中 环图
                levelDraw() {
                    var charts = echarts.init(document.getElementById('levelDraw'))
                    charts.clear();
                    let self = this;
                    charts.setOption({

                        color: [new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                            offset: 0,
                            color: 'rgba(17, 83, 127, 1)'

                        },
                        {
                            offset: 1,
                            color: 'rgba(47, 121, 140, 1)'
                        },
                        {
                            offset: 1,
                            color: 'rgba(59, 200, 207, 1)'
                        },
                        {
                            offset: 1,
                            color: 'rgba(58, 201, 206, 1)'
                        }
                        ]),

                        new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                            offset: 0,
                            color: 'rgba(29, 104, 249, 0.3)'
                        },

                        {
                            offset: 1,
                            color: 'rgba(92, 175, 255, 0.3)'
                        }
                        ]), new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                            offset: 0,
                            color: 'rgba(59, 199, 207, 1)'
                        },

                        {
                            offset: 1,
                            color: 'rgba(0, 124, 211, 1)'
                        }
                        ]), new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                            offset: 0,
                            color: 'rgba(33, 171, 184, 1)'
                        },

                        {
                            offset: 1,
                            color: 'rgba(119, 224, 129, 1)'
                        }
                        ])


                        ],
                        tooltip: {
                            trigger: 'item'
                        },
                        legend: {
                            top: '0%',
                            left: 'center',
                            show: false
                        },


                        series: [{

                            name: 'Access From',
                            type: 'pie',
                            radius: ['40%', '70%'],
                            avoidLabelOverlap: true,
                            minAngle: 3, //最小占比
                            emphasis: {
                                label: {
                                    show: true,
                                    fontSize: 12,
                                    // fontWeight: 'memory',
                                    color: '#2b85f3',
                                }
                            },

                            itemStyle: {
                                borderRadius: 1,
                                borderWidth: 20
                            },

                            center: ['50%', '50%'], // 这个属性可以调整图像的位置，左面所示为中心
                            label: {

                                normal: {
                                    color: '#fff',
                                    show: true,
                                    position: 'outside', // 数值显示外部/内部
                                    fontSize: 12,
                                    lineStyle: {
                                        width: 2,
                                        align: 'left', // 设置文字对齐

                                    },
                                    lineHeight: 26,
                                    //设置文字旋转角度
                                    // rotate: function (param) {
                                    //             // 计算当前数据项的角度
                                    //             const angle = param.value /  param.total *360;
                                    //             // 返回旋转角度，使文字与圆环角度适配
                                    //             return angle / 2;
                                    // },
                                    // formatter: '{c|{c}} ({d|{d}%})\n{hr|}\n{a|{a}}',
                                    // rich: {
                                    //     a: {
                                    //         padding: 4
                                    //     },
                                    //     b: {
                                    //         fontSize: 12,
                                    //         align: 'left',
                                    //         padding: 82,
                                    //         margin: 80,
                                    //         lineHeight: 80
                                    //     },
                                    //     hr: {
                                    //         borderColor: '#4681ec',
                                    //         width: '100%',
                                    //         borderWidth: 2,
                                    //         height: 0
                                    //     },
                                    //     d: {
                                    //         fontSize: 12,
                                    //         align: 'left',
                                    //         padding: 4
                                    //     },
                                    //     c: {
                                    //         fontSize: 12,
                                    //         align: 'left'
                                    //     }
                                    // }

                                    formatter: function (params) {

                                        let total = self.outputTwoCount + self.outputOneCount + self.outputThreeCount + self.outputFourCount;
                                        let percentage = 0 + "%";
                                        if (total !== 0) {
                                            percentage = (params.value / total * 100).toFixed(0) + '%';
                                        }

                                        // return params.name +  percentage + '\n'+params.value +"台";
                                        return params.name + percentage;

                                    },

                                },
                            },

                            labelLine: {
                                show: true,
                                length: 10,
                                length2: 22
                            },
                            data: this.levelList,
                            // data: [
                            //     {
                            //         "name": "一级",
                            //         "value": 59
                            //     },
                            //     {
                            //         "name": "二级",
                            //         "value": 0
                            //     },
                            //     {
                            //         "name": "三级",
                            //         "value": 0
                            //     },
                            //     {
                            //         "name": "四级",
                            //         "value": 18
                            //     }
                            // ],

                        }
                        ]

                    }, true);

                    clearInterval(this.timeLevel);

                    // 以下代码放在setOption之后
                    let index = 1; //默认选中第1个
                    this.timeLevel = setInterval(() => {
                        if (index == 1) {
                            this.levelName = "四级(台)"
                            this.levelValue = this.outputFourCount;
                            charts.dispatchAction({

                                type: 'highlight',
                                seriesIndex: 0,
                                dataIndex: 3,
                            });
                            // charts.series[0].label.color = "#b92a2a"
                            charts.dispatchAction({
                                type: 'downplay',
                                seriesIndex: 0,
                                dataIndex: 0,
                            });
                            index = 2;
                        }
                        else if (index == 2) {
                            this.levelName = "三级(台)"
                            this.levelValue = this.outputThreeCount;
                            charts.dispatchAction({
                                type: 'highlight',
                                seriesIndex: 0,
                                dataIndex: 2,
                            });
                            charts.dispatchAction({
                                type: 'downplay',
                                seriesIndex: 0,
                                dataIndex: 3,
                            });
                            index = 3;
                        }
                        else if (index == 3) {
                            this.levelName = "二级(台)"
                            this.levelValue = this.outputTwoCount;
                            charts.dispatchAction({
                                type: 'highlight',
                                seriesIndex: 0,
                                dataIndex: 1,
                            });
                            charts.dispatchAction({
                                type: 'downplay',
                                seriesIndex: 0,
                                dataIndex: 2,
                            });
                            index = 4;
                        } else {
                            this.levelName = "一级(台)";
                            this.levelValue = this.outputOneCount;

                            charts.dispatchAction({
                                type: 'highlight',
                                seriesIndex: 0,
                                dataIndex: 0,
                            });
                            charts.dispatchAction({
                                type: 'downplay',
                                seriesIndex: 0,
                                dataIndex: 1,
                            });
                            index = 1;
                        }

                    }, 10000)

                    window.addEventListener(
                        'resize',
                        () => {
                            setTimeout(() => {
                                charts.resize()
                            }, 100)
                        },
                        false,
                    )

                },



                //右中 本月常规工作时段外的手术量
                getSurgicalVolumeOutsideRegularHours() {
                    const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/surgicalVolumeOutsideRegularHoursGet';
                    let self = this;
                    $.ajax({
                        url,
                        type: 'get',
                        dataType: 'json',
                        success(res) {
                            console.log("+++++本月常规工作时段外的手术量变化++++++++");
                            console.log(res);
                            if (res.code == '1') {
                                self.earlyCount = res.data.earlyCount;
                                self.workDayLateStartCount = res.data.workDayLateStartCount;
                                self.workDayLateEndCount24 = res.data.workDayLateEndCount24;
                                self.workDayLateEndCount18 = res.data.workDayLateEndCount18;
                                self.holidayCount = res.data.holidayCount;
                            }
                        },
                        error(err) {
                            console.log('获取本月常规工作时段外的手术量信息请求失败')
                        }
                    })

                },

                //右下-首台手术开台时间分布
                // getFirstOperStartTimeDistribution() {
                //     const url = this.httpUrl + '/oriot_op/api/comprehensiveSituationMap/firstOperStartTimeDistributionGet';
                //     let self = this;
                //     $.ajax({
                //         url,
                //         type: 'get',
                //         dataType: 'json',
                //         success(res) {
                //             console.log("+++++首台手术开台时间分布++++++++");
                //             console.log(res);
                //             if (res.code == '1') {
                //                 // self.earlyCount = res.earlyCount;
                //                 // self.workDayLateStartCount = res.workDayLateStartCount;
                //                 // self.workDayLateEndCount24 = res.workDayLateEndCount24;
                //                 // self.workDayLateEndCount18 = res.workDayLateEndCount18;
                //                 // self.holidayCount = res.holidayCount;
                //             }
                //         },
                //         error(err) {
                //             console.log('获取首台手术开台时间分布信息请求失败')
                //         }
                //     })
                //
                // },
                //
                // opTimeDistribution(value) {
                //
                //     const myElement1 = document.getElementById("TimeDistribution1-ul");
                //
                //     // myElement1.style.setProperty('--content', `"${value}"`);
                //     // myElement1.innerHTML = '<div id="hoverBoxTrigge">1</div>';
                //     // const myElemen = document.getElementById("hoverBoxTrigge");
                //
                //     value.forEach((itemData) => {
                //         const listItem = document.createElement('li');
                //         listItem.classList.add('TimeDistribution1-li');
                //
                //         const spanItem1 = document.createElement('span');
                //         spanItem1.classList.add("span-item1");
                //
                //         listItem.textContent = itemData;
                //
                //         listItem.appendChild(spanItem1)
                //
                //         myElement1.appendChild(listItem);
                //     });
                //
                //     const myElement2 = document.getElementById("hoverBoxTrigger2");
                //     myElement2.style.setProperty('--content', `"${value[1]}"`);
                //
                //     const myElement3 = document.getElementById("hoverBoxTrigger3");
                //     myElement3.style.setProperty('--content', `"${value[2]}"`);
                //
                //     const myElement4 = document.getElementById("hoverBoxTrigger4");
                //     myElement4.style.setProperty('--content', `"${value[3]}"`);
                //
                //     const myElement5 = document.getElementById("hoverBoxTrigger5");
                //     myElement5.style.setProperty('--content', `"${value[4]}"`);
                //
                //     const myElement6 = document.getElementById("hoverBoxTrigger6");
                //     myElement6.style.setProperty('--content', `"${value[5]}"`);
                //
                // },

                // 设置表格自动滚动
                setTableRoll(divName) {
                    console.log(divName);
                    this.intervals[divName] = setInterval(function () {
                        let tbodyDom = $("#" + divName).find("tbody"),
                            trDom = tbodyDom.find('tr:first'),
                            trHeight = trDom.height();
                        console.log(tbodyDom);
                        tbodyDom.animate({
                            // marginTop: -trHeight+'px'
                        }, 600, function () {
                            // tbodyDom.css('marginTop', 0);
                            trDom.css("marginTop", 0).appendTo(tbodyDom);
                        })
                    }, 5000)
                },
                // click1() {
                // 	document.addEventListener('DOMContentLoaded', function() {
                // 		var triggerElement = document.getElementById('hoverBoxTrigger');
                // 		var statusBar = document.getElementById('clickHoner');
                // 		var isHoverBoxVisible = false;
                //
                // 	// triggerElement.addEventListener('click', function() {
                // 	// 	isHoverBoxVisible = !isHoverBoxVisible;
                // 	// 	statusBar.style.display = isHoverBoxVisible ? 'block' : 'none';
                // 	// });
                //
                // 	// triggerElement.addEventListener('mouseover', function() {
                // 	// 	statusBar.style.display = 'block';
                // 	// });
                // 	//
                // 	// triggerElement.addEventListener('mouseout', function() {
                // 	// 	statusBar.style.display = 'none';
                // 	// });
                // 	//
                // 	// triggerElement.addEventListener('mouseover', function() {
                // 	// 	statusBar.classList.add('visible'); // 添加类来显示状态栏并触发动画
                // 	// });
                // 	//
                // 	// triggerElement.addEventListener('mouseout', function() {
                // 	// 	statusBar.classList.remove('visible'); // 移除类来隐藏状态栏
                // 	// });
                //
                //
                // 	// triggerElement.addEventListener('mouseover', () => {
                // 	// 	statusBar.style.backgroundColor = '#f1c40f';
                // 	// });
                // 	//
                // 	// triggerElement.addEventListener('mouseout', () => {
                // 	// 	statusBar.style.backgroundColor = '#bdc3c7';
                // 	// });
                //
                // 		// triggerElement.addEventListener('mouseover', () => {
                // 		// 	var infoLabel = triggerElement.getAttribute('data-info');
                // 		// 	document.getElementById('triggerElement').innerHTML = `<div class="info-content">${infoLabel}</div>`;
                // 		// 	// document.getElementById('clickHoner').style.display = 'block';
                // 		// });
                //
                // 		// triggerElement.addEventListener('mouseout', () => {
                // 		// 	document.getElementById('clickHoner').style.display = 'none';
                // 		// });
                // 	})
                // 	}
                // document.addEventListener('DOMContentLoaded', function() {
                //
                // 	document.querySelectorAll('.triggerElement').forEach(triggerElement => {
                // 		triggerElement.addEventListener('mouseover', () => {
                // 			var infoLabel = triggerElement.getAttribute('data-info');
                // 			document.getElementById('clickHoner').innerHTML = `<div class="info-content">${infoLabel}</div>`;
                // 			document.getElementById('clickHoner').style.display = 'block';
                // 		});
                //
                // 		triggerElement.addEventListener('mouseout', () => {
                // 			document.getElementById('clickHoner').style.display = 'none';
                // 		});
                // 	});
                // })
                // },
            },

            beforeDestroy() {
                if (this.echartsInstance) {
                    this.echartsInstance.dispose();
                }
                if (this.echartsInstance2) {
                    this.echartsInstance2.dispose();
                }


                // 组件销毁前清除定时器
                this.stopAutoSwitch();
                this.stopAutoSwitch2()

            },


        })
    </script>

    <style type="text/css">
        .note-div-span {
            position: absolute;
            top: 45%;
            left: 32%;
        }

        .note-span1 {
            line-height: 0.47rem;
            color: #fff;
            font-size: 0.24rem;
            font-weight: 600;
        }

        .note-span2 {
            font-family: PingFang SC, PingFang SC, serif;
            color: rgba(176, 184, 205, 1);
            font-size: 0.14rem;
        }

        .note-span2y {
            color: rgba(255, 255, 255, 1);
            font-size: 0.15rem;
        }

        .note-span3 {
            /*text-align: center;*/
            line-height: 0.35rem;
            /*left: 25%;*/
            color: #B0B8CD;
            font-size: 0.15rem;
            /*text-align: center;*/
        }

        .note-span4 {
            position: absolute;
            top: 5%;
            left: 25%;
            color: #B0B8CD;
            font-size: 0.15rem;
            line-height: 0.45rem;
        }

        .note-span5 {
            position: absolute;
            top: 15%;
            left: 30%;
            color: #B0B8CD;
            font-size: 0.16rem;
        }

        .note-span6 {
            color: #B0B8CD;
            font-size: 0.15rem;
        }
    </style>
</body>

</html>